东子个人博客

记开发简易个人博客系统

  1. 1. 前言
  2. 2. 正文
  3. 3. 后文

前言

众所周知,市场上许多博客框架,如wordpress、typecho等,自己也想试着开发一下。
大概是两年前吧,做了一个简易的个人博客系统,但没有前后端分离,相当于html和php相互嵌套着。
这次重新做一个的话,考虑到前后端分离,就需要写后端和前端代码。

正文

看网上许多都是用Springboot开发后端api,因为对这方面不熟悉,还是选择使用PHP开发。
后台前端当然用Vue.js开发,前台前端本来打算用Nuxt.js开发,因为对SEO友好,不像Vue.js。但是对Nuxt不熟悉,导致部署到服务器上运行不了,最后决定前台前端也是用Vue.js开发。

当然,以上这些只是基本的思路,更需要一个详细的方案,比如说数据表怎么设计、api请求地址啊请求参数啊都需要考虑,这里,简单放一下,我在开发之前做的有关文档:
图片描述
图片描述
然后,给看一下,最后的后台前端开发效果:
图片描述
图片描述
在这里,提一下,因为后台这里要发布文章,之前看大锯老师的课程,用过mavon-editor这个编辑器,最后选择使用这个Vue编辑器,
图片描述
因为没仔细看文档,简略的按照文档上的提示,使用了之后发现显示不出来以及控制台报错,最后看了一下,像使用Vue.js3的话,要安装对应的3.0以上版本,我打开package.json看了一下,是2.多的,我又安装了一遍,最后才显示出来。emmm,这也相当于一次摸索。

下来,给看一下前台效果:
图片描述
文章 / 动态 页面:
图片描述
友链页面:
图片描述
前台这些样式设计参考了网上一些优秀网站,模仿的写了写样式。本来在考虑是否做评论这个模块,后来想了想,还是做吧,开发好对应api之后,在vue中把评论封装为一个组件,大概样式如下:
图片描述
因本人能力有限,目前仅支持一级评论。因为不太了解如何用PHP写获取评论列表这个API中,对应的把二级评论给添上去,后续有时间的话,可以再琢磨琢磨。

后文

以上,就是对于分享这次开发个人简易博客系统的体会,感谢您的浏览,欢迎在评论区讨论。