校园树洞,基于 **Vue 3 + Go (Gin)** 的 Markdown 社区,类小红书的帖子网站
点击空白处退出提示
校园树洞,基于 **Vue 3 + Go (Gin)** 的 Markdown 社区,类小红书的帖子网站
### 前端功能
- **用户与认证**:登录、注册、登出,JWT 鉴权,支持访客浏览
- **Markdown 编辑**:实时编辑与预览,编辑区/预览区滚动联动,代码语法高亮(可自定义颜色)
- **主题与字体**:深色/浅色主题切换,全局滚动条与全局字体(Start)统一
- **文档管理**:新建、打开、保存、删除、导入本地文件,文档存储于数据库
- **导出**:导出为 HTML、Markdown、PDF
- **音效**:编辑与导出时的音效反馈
- **布局**:可折叠左右侧边栏(左侧:上传记录 + 代码块高亮颜色调整;右侧:我的文档 + 文档操作 + AI 续写)
- **右侧栏 AI 续写**:详细模式可调长度与风格,API Key 仅保存在本地浏览器,不上传服务器
- **社区页**:创作社区入口、功能卡片、最新动态展示
- **桌宠**:桌面宠物(显示/隐藏、拖拽、互动等)
### 后端功能
- **认证 API**:注册、登录、获取用户资料
- **文档 API**:上传、列表、获取、更新、删除、搜索、统计(需 JWT)
- **JWT**:签发与校验 Token,支持受保护接口
- **MySQL**:用户表、文档表、文档点赞表存储;建议首次部署执行 `backend/databaseinit/init.sql` 完成建库建表,后端在数据库不存在时会自动建库及用户表
- **CORS**:支持本地多端口前端开发
- **健康检查**:`/health` 用于存活探测
本人在项目中承担全栈核心开发工作。后端侧负责 MySQL 数据库表结构设计、用户认证与 JWT 鉴权体系落地、文档全生命周期 CRUD / 搜索 / 统计接口、社区贴文与点赞接口的开发,同时实现 CORS 跨域中间件、健康检查接口,并编写数据库初始化脚本与部署配置;前端侧负责 Markdown 实时编辑与预览模块、双向滚动联动、代码高亮配色自定义、AI 续写功能(API 密钥本地存储)、社区页面、桌面宠物交互组件的开发,同时实现深浅主题切换、文档多格式导出等功能,并完成前后端联调与性能优化。
项目采用前后端分离架构,前端基于 Vue 3 + Vite 构建,集成 Markdown-it、Highlight.js、html2pdf.js 等库实现编辑器核心能力;后端基于 Go 语言 Gin 框架搭建分层服务架构,对接 MySQL 8.x 存储数据,通过 JWT 实现接口权限控制。项目亮点在于:AI 续写密钥纯本地存储不上传服务端,充分保障用户隐私;编辑器实现编辑与预览区精准滚动联动,支持自定义主题、字体与代码高亮;后端内置自动建库逻辑,配套初始化脚本,部署上手成本低;内置桌面宠物、操作音效等交互细节,产品体验更丰富。实现难点包括:解决内容高度动态变化下的滚动位置精准同步问题;优化大体积文档导出 PDF 的排版兼容与渲染性能;保障全链路 JWT 鉴权的前后端一致性与令牌生命周期管理;优化长文本文档搜索接口的查询性能与索引设计。




评论