🎯 轻量级前后端分离博客
基于vite + nodejs + MongoDB + vue2 的博客发布系统
适合个人或小团队共同维护技术博客、项目文档。
📸 系统截图一览
| 功能 | 预览 | 亮点 |
|---|---|---|
| 首页文章列表 | ![]() |
响应式卡片、倒序 + 分页 |
| 文章详情 & 代码高亮 | ![]() |
Markdown + Highlight.js、深色/浅色随系统 |
| 管理后台登录 | ![]() |
简洁登录、支持"记住我" 7 天 |
| 文章编辑器 | ![]() |
左源码右预览、拖拽传图 |
| 文章管理列表 | ![]() |
批量删除、快捷标签、一键置顶 |
| 用户资料页 | ![]() |
头像裁剪、社交链接实时校验 |
🚀 核心流程
访客 首页 阅读 管理员 /admin 撰写/编辑/删除
🛠 技术栈
| 端 | 技术 |
|---|---|
| 前端 | Vue2 + Vue Router + Vuex + Element UI + Vite |
| 后端 | Node.js + Express + MongoDB(Mongoose) |
| 会话 | Express-Session + MongoDB 存储 |
| Markdown | Marked + Highlight.js |
🧩 数据模型
Article
title|date|content(Markdown)|gist|labels
User
name|password|email|bio|avatar|社交链接|registrationDate
特点:文章池共享,无 author 字段,任何管理员均可管理全部文章。
🔐 权限矩阵
| 角色 | 权限 |
|---|---|
| 访客 | 仅可看 |
| 管理员(注册用户) | 增删改文章 + 改自己资料 |
⚡ 一键启动
bash
npm install
npm run server # 后端 5200
npm run dev # 前端 3000
首次使用:访问 http://localhost:3000/admin/signin 注册管理员即可发文。
📌 已知短板 & 改进计划
- 密码明文 → 使用 bcrypt 加密
- 权限扁平 → 引入角色(超级管理员 / 普通管理员)
- 无操作日志 → 增加审计记录
- 文章无作者 → 添加 author 字段,支持"仅作者可改"开关





