历时一个月,独立开发一个从零到部署上线的个人博客全栈项目

本文讲述了作者开发一个个人博客项目的过程,包括技术选型(Vue3+ts+nuxt2+express),项目结构设计,开发阶段的优化措施(如SEO、性能优化),以及自动部署的搭建(使用github-action和docker)。

这篇文章本该是在22年底就开始写的,因为准备校招和后续公司的事情一拖再拖,终于前段时间在腾讯云服务器到期之后,我又买了一年的阿里云服务器,重新把项目的自动部署搭建在阿里云服务器上让项目重新上线后,我决定写这篇文章来记录一下这个项目的整体开发。

在这里插入图片描述

在22年底的时候,那时候还是大四的寒假,为了校招的项目经历,也是为了锻炼自己独立从项目搭建到项目部署优化的开发能力,我决定着手开发一个集后台与前台一体的个人博客项目,之所以选择开发博客项目,一是因为博客项目确实是作为独立开发最合适的项目选择,在技术选型上更能提升自己,二是开发了博客项目后能将自己的笔记和知识点记录下来,所以当时有了这个想法后就开始着手准备开发。既然选择了开发满大街的个人博客项目,就得有自己的项目亮点,所以我决定把重心放在项目的技术选型和后续优化部署上。

开发前期

项目从零开始开发的第一步就是技术选型以及项目结构和整体样式以及项目大体逻辑的设计

首先是项目的技术选型,博客项目有前台以及后台系统两部分,后台管理系统使用vue3+ts+vite开发,而前台网站由于面向用户,展示文章,需要考虑到后续的优化以及浏览器的seo,所以当时考虑决定使用vue对应的服务端渲染框架nuxt来进行开发,nuxt开发的一大特点是服务端直接返回完整的html供浏览器直接渲染,这样带来的好处有两个,一是不需要浏览器解析从而能够很大程度上减少白屏时间,二是直接返回html有利于浏览器的seo搜索引擎搜索。在决定使用nuxt开发前台网站后,当时尝试过使用nuxt3开发,但是当时nuxt3还处于rc测试版本,有很多坑,所以后面还是使用了更为稳定的nuxt2进行开发。

这样前端的技术选型基本确定下来了,至于后端,作为一名前端开发,自然是使用node来开发后端,当时选择了express框架结合mysql数据库

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值