# HLAE 中文站开发计划 (Bun + Elysia + React + HeroUI) 本计划旨在构建 HLAE 中文站,基于 Bun Monorepo 架构,前端使用 Vite + React + HeroUI v3,后端使用 Elysia.js + Prisma (SQLite)。 ## 1. 项目初始化与依赖配置 * [ ] **检查与安装依赖** * [ ] Web 端安装 `swr`, `zustand`。 * [ ] 确认 `backend` 和 `web` 的 workspace 关联,确保类型共享。 * [ ] **类型安全配置 (Eden)** * [ ] 在 Backend 导出 `App` 类型。 * [ ] 在 Web 端正确引入 `App` 类型以实现端到端类型安全。 * [ ] **环境变量配置** * [ ] 配置 Backend `.env` (数据库路径, Auth Secret 等)。 * [ ] 配置 Web `.env` (API 地址等)。 ## 2. 数据库与后端基础 * [ ] **Prisma Schema 设计** * [ ] 完善 `User` 模型 (适配 better-auth)。 * [ ] 设计 `Resource` (资源/传送门) 模型:包含标题、描述、链接、图标/图片、分类等字段。 * [ ] 设计 `Post` (帖子) 模型:包含标题、内容、作者、发布时间等。 * [ ] 执行 `bun prisma migrate dev` 生成数据库表。 * [ ] **后端核心功能** * [ ] **Auth**: 集成 `better-auth`,实现注册、登录、注销、获取当前用户接口。 * [ ] **Resources**: 实现资源的增删改查 (CRUD) 接口。 * [ ] **Posts**: 实现帖子的增删改查接口。 * [ ] **API 导出**: 确保所有路由都挂载到主 App 实例。 ## 3. 前端基础架构 (Web) * [ ] **HeroUI v3 配置** * [ ] 确保 `tailwind.css` 和 `HeroUI` 样式正确加载。 * [ ] 配置全局 Theme (亮/暗色)。 * [ ] **状态管理 & 数据请求** * [ ] 封装 `useClient` 或类似 Hook,结合 `eden` 和 `swr` 进行数据请求。 * [ ] 使用 `zustand` 管理全局状态 (如当前用户信息、UI状态)。 * [ ] **路由配置** * [ ] 使用 `react-router` 配置页面路由 (首页、登录、注册、资源页、帖子页、管理页)。 ## 4. 功能模块实现 * [ ] **认证模块 (Auth)** * [ ] 实现登录页面 (Login Page)。 * [ ] 实现注册页面 (Register Page)。 * [ ] 实现受保护路由 (Protected Routes)。 * [ ] **资源/传送门模块 (Resources/Teleport)** * [ ] **展示**: 使用 HeroUI `Card` 组件展示资源列表。 * [ ] **编辑**: 实现“在线编辑”功能 (管理员或特定用户权限),支持添加/修改/删除资源卡片。 * [ ] **帖子模块 (Posts)** * [ ] **列表**: 展示帖子列表。 * [ ] **详情**: 展示帖子详情。 * [ ] **发布**: 实现发帖编辑器和发布功能。 ## 5. 测试与优化 * [ ] **功能测试** * [ ] 测试完整的注册/登录流程。 * [ ] 测试资源的增删改查。 * [ ] 测试发帖功能。 * [ ] **UI/UX 优化** * [ ] 响应式布局调整。 * [ ] Loading 状态和错误处理。