Vue3+TypeScript+Django Rest Framework 搭建个人博客
Vue3+TypeScript+Django Rest Framework 搭建个人博客
本文适合对有Python
语言有一定基础的人群,希望利用Python
做更多有意思的事情,比如搭建个人博客,记录自己的所思所想,或者想找一个项目实践前后端分离技术等等。跟着本文可以了解和运行项目,本项目是在Window 10 Professional
系统下开发。
大家好!我是 落霞孤鹜
,从今天开始一步一步搭建一套基于 Python 语言的个人博客, 这个项目也是我的个人博客搭建过程的记录,在实现过程中踏过了很多坑,这些坑也会在实现具体功能时列举出来,希望能帮助到可能遇到同样问题的你。
整个项目从开始实现到完成,我耗时2个星期,这两个星期是利用晚上下班时间完成的,每天花费1个小时左右,所以合起来大约是个15-20个小时左右,在这里说明时间是想让小伙伴们能对自己完成这个项目的时间有一个初步的评估。
一、项目背景
做个人博客也是我思考良久后的一个目标,大学期间在QQ空间记录自己的心路历程,工作后一直没有找到一个好的地方承载自己的所思所想(当然,这也是自己懒,没有花精力去整理),后来在简书上写过几篇博客,再后来觉得知乎和公众号也是一个很好的平台。但是今年觉得,虽然这些平台都挺好,终归不是自己的家,希望能给自己的文字找一个家。在这样的想法下催生了搭建一个自己的博客这么一个想法。
自己熟悉 Java
和 Python
,两种语言都写过完整的项目,但是还没有用 Python
结合前后端分离技术实现一套 Web 系统。所以最终决定用 Python
来开发。
在实现博客的过程中,我借鉴了很多 夜尽天明的博文,基于他的思想和方式,完成了前端代码的构建。
已经实现的博客地址: 落霞孤鹜的个人博客
已经写好的代码仓库:
- 后端:
- 前端:
效果图:
二、技术栈
博客基于的技术如下:
- Django 框架:快速搭建 Web 应用程序的 Python 开源框架,该框架功能齐全,是 Python 世界的 Spring,Lavarel,Ruby On Rail。
- Django Rest Framework:用于将Django全栈框架的视图层转换成基于Restful的接口,适配前后端分离架构。
- Vue 3:是一套用于构建用户界面的渐进式框架,在前后端分离架构下负责前端页面的开发。
- Element-Plus:一套基于 Vue 3.0 的桌面端组件库,可以帮助开发者快速搭建Vue 3的页面。
- TypeScript:
TypeScript
是微软开发的一个开源的编程语言,通过在JavaScript
的基础上添加静态类型定义构建而成,帮助JavaScript
能够胜任开发大型项目, TypeScript 教程 - SQLite 数据库:是一种嵌入式数据库, 它的数据库就是一个文件。
顺便提一下开发工具。
- Pycharm: JetBrains 公司出品的
Python
语言的IDE
,功能强大,可以使用社区版本,也可以使用付费的旗舰版。 - VS Code:前端开发利器,微软公司出品的开源免费文本编辑器,通过插件实现
IDE
的功能,也可以用 JetBrains 出品的WebStorm
。
三、项目结构
项目使用前后端分离框架,所以代码项目结构按照前端和后端两部分呈现