wallBlog

一款简洁的集体博客零碎

1. wallBlog 线上地址：http://dzblog.cn/article/5a69609c3c04164b0bd4b964
2. Gitub 地址：https://github.com/Sujb-sus/wallBlog

次要性能

客户端

• 文章性能：文章内容反对 Markdown 语法且代码高亮展现；
• 标签性能：通过标签分类来检索文章数据；
• 侧边栏性能：点击排行、站长举荐和标签分类等；
• 搜寻性能：通过关键词检索文章的题目和摘要，并反对搜寻高亮；
• 留言性能：可点赞、回复评论，统计评论以及回复总数，反对 Emoji 表情；
• 其余性能：图片懒加载、分页、侧边栏吸顶以及一键置顶等；

治理端

• 权限治理：CRUD 管理员，可调配权限；
• 文章治理：CRUD 文章，文章封面反对本地上传、文章内容反对 Markdown 语法编辑；
• 标签治理：CRUD 标签，标签背景色反对用 Vue-Color 插件自定义抉择；
• 留言治理：RD 评论以及回复；

我的项目构造

技术利用

• 前端：Vue、Element-UI、ES6、Webpack、Less、Axios、Markdown-Editor、Highlight、Vue-Color、Vue-Lazyload等；
• 后端：Node、Koa2、Jwt、MongoDB、Busboy、Log4、Node-Notifier、Ora、Chalk、Rimraf等；
• 运维：宝塔 Linux 面板 、Nginx、PM2 管理工具 等；

注意事项：

1. 我的项目启动前，须要在本地装置好 MongoDB 服务，请自行装置；
2. 启动本地的 mongo 服务，开始给数据库初始化一些必要数据；

• 数据库名可自行批改，然而须要跟 code/server/config.js 文件同步上；
• 登录治理后盾时，须要给数据库创立 users 汇合，并注册一个账号进行登录；

> mongo // 开启 mongo 服务
> show dbs // 显示数据库列表
> use wallBlog // 新建一个 wallBlog 数据库
> db.createUser({user:"wall",pwd:"123456",roles:[{role:"readWrite",db:'wallBlog'}]}) // 在 wallBlog 数据库创立一个 wall 用户，明码为 123456
> show users // 展现该库有哪些用户
> db.auth("wall", "123456"); // 数据库认证一下用户、明码
> db.users.insert({  // 往该库的 users 汇合插入一条数据，账号：admin  明码：123456
    "pwd" : "e10adc3949ba59abbe56e057f20f883e",
    "username" : "admin",
    "roles" : ["admin"]
})
> show collections // 查问该库下的汇合（相似于 mysql 的表）> db.users.find() // 查问 users 汇合下的所有数据

3. 初始化好本地的 MongoDB 数据库，就能够在 code/server/config.js 文件下配置账号、明码以及数据库名称；
4. npm run dev:server开启后盾接口服务；
5. npm run dev:admin启动治理后盾界面，用下面注册的账号密码登录，并录入文章数据；
6. npm run dev:client启动客户端页面；

脚本命令

本我的项目是基于 Webpack5.5 来构建与打包的。

• npm run dev:admin // 本地开发治理端页面
• npm run dev:client // 本地开发客户端页面
• npm run build:admin // 我的项目打包 – 治理端
• npm run build:client // 我的项目打包 – 客户端
• npm run analyz // 查看打包信息
• npm run server // 启动后盾接口服务