Essay3.0发布,基于JavaScript的前后端同构博客系统

前言

转眼间距离我开源这个项目已经两年了,最初是奔着学习的目的开发了这个项目,后来一直记录自己的学习笔记。随着时间的增长,发现之前写的代码简直不忍直视,于是就有了重构的想法。这个过程有些漫长,竟然用了整整四个月的业余时间,但是为了能开发出自己心目中满意的博客系统,我还是决定入坑了

分类功能

Essay3.0发布,基于JavaScript的前后端同构博客系统

为了方便查找文章,添加了分类功能。分类支持创建私有分类和公开分类,之所以开发这个功能,是为了方便写不能公开的文章,比如你可以创建一个日记分类。私有分类下的文章只有博主自己能看到,它在前台的显示效果如下图

Essay3.0发布,基于JavaScript的前后端同构博客系统

进入详情页可以对文章进行编辑和删除操作

Essay3.0发布,基于JavaScript的前后端同构博客系统

标签功能

一篇文章除了分类外,还可以为其添加标签,目的同样是为了快速查找文章。唯一的不同是,一篇文章可以有多个标签,但是只能有一个分类(也可以没有分类)。

Essay3.0发布,基于JavaScript的前后端同构博客系统

发布文章

Essay3.0发布,基于JavaScript的前后端同构博客系统

发布文章时,文章可以选择是否允许评论以及是否推荐到首页,如果不推荐到首页,那么它只在分类和标签下显示。为了防止内容丢失,添加了文章自动保存的功能。

单页功能

Essay3.0发布,基于JavaScript的前后端同构博客系统

有时候你可能希望能自定义一些内容,比如在导航栏添加个”关于“栏目,内容是支持HTML的,所以相当于自定义个性网页

用户

Essay3.0发布,基于JavaScript的前后端同构博客系统

其实博客系统是没有用户管理的,只不过评论功能是基于GitHub登录的,而GitHub的鉴权token是有效期的,所以为了能让用户长时间保持登录状态,就把数据保存到了数据库,由后端生成一个新的token

评论功能

Essay3.0发布,基于JavaScript的前后端同构博客系统

评论功能是基于GitHub登录的,鉴权后可以对文章进行留言和点赞,当留言被回复后,用户会收到一封通知邮件。这些留言可以在后台看到

控制面板

Essay3.0发布,基于JavaScript的前后端同构博客系统

其实这是个可有可无的功能,为了查看一些全局的信息还是简单做了下,比如可以在线查看数据库版本、Node版本。

整个项目在技术选型上,前端使用了Nuxt(主要是为了考虑SSR),后端使用的express,数据库是MongoDB。这些技术入门比较简单,但是要想掌握好,也是一个无底洞

结语

以上就是3.0的所有功能,如果发现了bug,欢迎在github上提issue,我将在第一时间修复

项目地址:https://github.com/wmui/essay

以上,感谢阅读!

上一篇:HighCharts之2D数值带有百分数的面积图


下一篇:HighCharts之2D颜色阶梯饼图