墨笺 - 个人书写平台

一个基于 Node.js + Koa + Vue 3 构建的个人写作应用，适合写小说、随笔等。

技术栈

• 后端: Node.js + Koa 2 + koa-body + koa-static
• 前端: Vue 3 (Composition API) + Vite + Vue Router + Axios
• 数据存储: 本地 JSON 文件
• 编辑器: Markdown 支持 (marked + dompurify)

功能特性

v1.0.0 (MVP 版本)

• ✅ 文章创建、编辑、删除
• ✅ Markdown 编辑器 + 实时预览
• ✅ 分类管理
• ✅ 标签管理
• ✅ 主题切换（浅色/深色/护眼）
• ✅ 一键插入分割线
• ✅ 导出为 Markdown
• ✅ 本地文件存储

v1.1.0 (功能增强)

• ✅ 搜索功能（支持标题、内容、标签搜索）
• ✅ 图片上传功能
• ✅ 更多导出格式（HTML、PDF、Word）
• ✅ 编辑器工具栏优化

项目结构

write_APP/
├── backend/              # Koa 后端
│   ├── src/
│   │   ├── index.js      # 入口
│   │   └── routes/       # API 路由
│   │       ├── articles.js
│   │       ├── categories.js
│   │       └── upload.js
│   ├── data/             # 数据存储
│   │   ├── articles/
│   │   ├── categories/
│   │   └── uploads/
│   └── package.json
├── frontend/             # Vue 3 前端
│   ├── src/
│   │   ├── views/
│   │   │   ├── ArticleList.vue
│   │   │   └── ArticleEditor.vue
│   │   ├── api/
│   │   │   └── index.js
│   │   ├── router/
│   │   │   └── index.js
│   │   ├── styles/
│   │   │   └── main.css
│   │   ├── App.vue
│   │   └── main.js
│   ├── index.html
│   ├── vite.config.js
│   └── package.json
├── package.json
└── README.md

快速开始

安装依赖

# 安装后端依赖
cd backend
npm install

# 安装前端依赖
cd ../frontend
npm install

启动应用

# 终端 1: 启动后端服务（端口 3000）
cd backend
npm run dev

# 终端 2: 启动前端开发服务器（端口 5173）
cd ../frontend
npm run dev

然后在浏览器中打开 http://localhost:5173

API 文档

文章接口

方法	路径	描述
GET	/api/articles	获取文章列表（支持 search 查询参数）
GET	/api/articles/:id	获取单篇文章
POST	/api/articles	创建文章
PUT	/api/articles/:id	更新文章
DELETE	/api/articles/:id	删除文章
GET	/api/articles/:id/export/markdown	导出为 Markdown
GET	/api/articles/:id/export/html	导出为 HTML

分类接口

方法	路径	描述
GET	/api/categories	获取分类列表
POST	/api/categories	创建分类
DELETE	/api/categories/:id	删除分类

上传接口

方法	路径	描述
POST	/api/upload	上传图片

使用说明

1. 新建文章: 点击首页右上角"新建文章"按钮
2. 搜索文章: 在搜索框中输入关键词，实时过滤文章列表
3. 插入分割线: 在编辑器中点击"分割线"按钮，适合多线小说
4. 上传图片: 点击"上传图片"按钮，选择图片后自动插入 Markdown 代码
5. 添加分类: 在首页输入新分类名称并点击添加
6. 切换主题: 在页面右上角选择不同主题（浅色/深色/护眼）
7. 导出文章: 在编辑器中选择导出格式（Markdown/HTML/PDF/Word）

简历亮点

这个项目展示了以下技能：

后端开发

• Node.js + Koa 2 框架使用
• RESTful API 设计与实现
• 路由中间件、错误处理
• 文件系统操作（fs-extra）
• 文件上传处理（koa-body）
• 静态文件服务

前端开发

• Vue 3 Composition API
• Vue Router 路由管理
• 组件化开发
• Axios HTTP 请求
• Markdown 渲染与 XSS 防护
• 主题切换（CSS 变量）
• 响应式设计

工程实践

• 前后端分离架构
• 模块化代码组织
• 功能迭代开发流程
• 本地数据持久化