技术栈

核心框架

Next.js 15

全栈 React 框架，支持 Server Components、Server Actions 和现代化的 App Router

• 版本: 15.5.4
• 核心特性: App Router, Server Components, Turbopack (开发环境)
• React 版本: 19.1.0

前端技术

UI 组件库

• Shadcn/UI: 基于 Radix UI 的可复用组件库
• Tailwind CSS 4: 实用优先的 CSS 框架
• Lucide React: 现代化图标库

主题与样式

• next-themes: 深色/浅色模式支持

后端与数据库

数据库

• PostgreSQL: 关系型数据库
• Drizzle ORM: TypeScript ORM 工具
  • 适配器: node-postgres
  • 工具: drizzle-kit, drizzle-seed
• Neon DB: 无服务器 PostgreSQL 托管服务

数据验证

• Zod: TypeScript 优先的 schema 验证库

认证与授权

• Better Auth: 现代化认证解决方案
  • 插件: Email OTP, Phone Number
  • 适配器: Drizzle Adapter

第三方服务集成

• Resend: 邮件发送服务
  • React Email Components: 邮件模版组件
• 阿里云 SMS: 短信发送服务

工具库

• date-fns: 日期处理库
• nanoid: 唯一 ID 生成器
• clsx & tailwind-merge: CSS 类名处理工具

日志系统

• Pino: 高性能 Node.js 日志库
• pino-pretty: 开发环境日志美化工具

测试数据

• @faker-js/faker: 测试数据生成

开发工具

包管理

• pnpm: 快速、节省磁盘空间的包管理器
• Node.js: >=20.15.0

代码质量

• ESLint: JavaScript/TypeScript 代码检查
• Prettier: 代码格式化工具
• TypeScript: 类型安全的 JavaScript 超集

Git 工作流

• Husky: Git hooks 管理器
• lint-staged: 对暂存文件运行 linters
• Commitlint: Conventional Commits 规范检查
  • 配置: @commitlint/config-conventional

CI/CD

• GitHub Actions: 自动化工作流和部署
• Vercel: 前端应用托管和部署平台

测试框架

单元测试

• Vitest: 快速的单元测试框架
  • Coverage: v8 coverage provider

组件测试

• Testing Library: React 组件测试
  • @testing-library/react
  • @testing-library/jest-dom
  • @testing-library/user-event
• jsdom: DOM 环境模拟

E2E 测试

• Playwright: 端到端测试框架
  • 支持多浏览器测试
  • 并行执行、trace 追踪、视频录制

文档工具

Fumadocs

基于 Next.js 的文档框架，支持 MDX 内容管理

• fumadocs-ui: UI 组件
• fumadocs-core: 核心功能
• fumadocs-mdx: MDX 内容处理
• fumadocs-twoslash: TypeScript 代码提示

内容增强

• Mermaid: 图表和流程图渲染
• Shiki: 代码语法高亮