空闲时间写了个类似简书的博客系统，写篇文章记录一下，因为我主要是做前端的，并不会后台语言，所以对于后台数据处理这块主要使用了Express和Sequelize。

主要功能

• 注册
• 登录（第三方github登录、邮件验证）
• 用户管理
• 文章管理
• 标签管理（管理员可见）
• 用户管理
• 评论、回复
• 点赞、关注
• 个人主页
• 设置、修改密码
• 站内信等功能

技术栈

前端

• Vue + Element-UI，标准的vue-cli项目。
• Vue-router管理路由，vue-axios管理http请求。
• 写文章那块使用的markdown编辑器，功能强大且好用,快捷方式很多。
• 为了实现类似简书的图片预览功能，使用了vue-photo-preview插件，前面写的文章中有介绍，请参考。
• 关于项目中的图标，一部分使用Element-UI自带的，另一部分使用的是阿里的图标库iconfont.

后端

• Node.js + Express + Sequelize
• Sequelize 是一个基于 promise 的 Node.js ORM, 目前支持 Postgres, MySQL, SQLite 和 Microsoft SQL Server. 它具有强大的事务支持, 关联关系, 读取和复制等功能.
• 使用Nodemailer实现发送邮件功能
• 上传的图片上传到青云，数据库只存储图片地址

效果图

只展示主要页面

注册

登录

首页

消息页面

私信页面

个人主页

后台主页

文章详情页面评论

运行

• cd client 进入前端目录，执行npm run dev
• cd server 进入后端目录，执行npm start, 数据库使用的wampserver的MySql

源码地址：github，技术小白一个，代码写的比较乱，边做边学，多多交流，仅供参考。