MyBlog 项目介绍 — 一个诗意的个人博客系统

项目文档

项目概述

MyBlog 是一个面向个人使用的全栈博客系统,追求简约诗意的设计风格。它不仅仅是一个博客——还集成了个人笔记、图片管理和完整的 API 管理功能,让你可以用最舒适的方式记录生活与技术。

核心功能

博客系统

  • 富文本 + HTML 双模式编辑器(基于 Tiptap)
  • 分类与标签管理
  • 草稿 / 发布状态切换
  • 全文搜索
  • SEO 友好(SSG/ISR 静态生成)

个人笔记

  • 与博客独立的笔记系统
  • 可选择公开或私有
  • 同样支持富文本编辑、分类、标签

图片管理

  • 基于 Vercel Blob 的图片存储
  • 拖拽上传
  • 一键复制链接

RESTful API

  • 完整的 CRUD API 接口
  • JWT Token 认证
  • 支持通过 API 发布博客、管理笔记、上传图片

其他特性

  • 暗色模式切换
  • 响应式设计,移动端友好
  • 滚动动画效果
  • ISR 增量静态生成,首屏秒开

技术栈

层级技术
框架Next.js 16 (App Router)
语言TypeScript
样式Tailwind CSS
数据库Neon PostgreSQL
ORMPrisma 7
图片存储Vercel Blob
富文本Tiptap (ProseMirror)
认证JWT + 简单密码
部署Vercel

项目结构

src/
├── app/
│   ├── (public)/       # 前台公开页面(首页、博客、归档、笔记、关于)
│   ├── admin/          # 管理后台(仪表盘、博客/笔记/图片/分类管理)
│   └── api/            # RESTful API 接口
├── components/         # 共享组件(Header、Footer、编辑器等)
└── lib/                # 工具库(数据库连接、认证)

设计理念

参考 Poetize 博客的诗意风格,MyBlog 追求:

  • 简约:大量留白,视觉不拥挤
  • 快速:静态页面秒开,交互流畅
  • 实用:API 优先,可通过 curl 或脚本管理内容
  • 美观:精心调配的配色方案,支持亮色/暗色模式