docs: 新增下一階段開發計劃
- 詳細的 4 階段開發路線圖 - 詞卡管理系統優先實作 - AI 生成功能整合計劃 - 學習模式設計規劃 - 數據可視化實作計劃 - 包含時程安排和成功指標 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
parent
b9f6eb1237
commit
3649e21ac9
|
|
@ -0,0 +1,263 @@
|
|||
# 🚀 DramaLing 下一階段開發計劃
|
||||
|
||||
## 📊 當前專案狀態
|
||||
|
||||
### ✅ **已完成功能**
|
||||
- **🔐 用戶認證系統**：註冊、登入、JWT token 驗證
|
||||
- **🏗️ 後端架構**：.NET Core API、SQLite 資料庫、錯誤日誌系統
|
||||
- **🎨 前端框架**：Next.js 15、認證上下文、保護路由
|
||||
- **📝 開發工具**：完整的錯誤監控和日誌系統
|
||||
|
||||
### 🎯 **技術債務**
|
||||
- 前端頁面使用 mock 資料，需要與後端 API 整合
|
||||
- 資料庫只有用戶表格，缺少詞卡相關資料
|
||||
- AI 生成功能尚未與 Gemini API 連接
|
||||
|
||||
---
|
||||
|
||||
## 🎯 下一階段開發重點
|
||||
|
||||
### **第一階段：核心詞卡功能 (1-2 週)**
|
||||
|
||||
#### **1.1 詞卡管理系統**
|
||||
**目標**：建立完整的詞卡 CRUD 功能
|
||||
|
||||
**後端任務**：
|
||||
- [x] `CardSetsController` - 詞卡集合管理
|
||||
- [x] `FlashcardsController` - 單張詞卡操作
|
||||
- [ ] 測試所有 API 端點
|
||||
- [ ] 建立預設詞卡資料
|
||||
|
||||
**前端任務**：
|
||||
- [ ] 整合 `/flashcards` 頁面與後端 API
|
||||
- [ ] 實作詞卡列表展示
|
||||
- [ ] 實作詞卡新增/編輯/刪除功能
|
||||
- [ ] 實作詞卡集合管理
|
||||
|
||||
**API 端點**：
|
||||
```
|
||||
GET /api/cardsets - 取得詞卡集合列表
|
||||
POST /api/cardsets - 建立新詞卡集合
|
||||
GET /api/flashcards - 取得詞卡列表
|
||||
POST /api/flashcards - 建立新詞卡
|
||||
PUT /api/flashcards/{id} - 更新詞卡
|
||||
DELETE /api/flashcards/{id} - 刪除詞卡
|
||||
```
|
||||
|
||||
#### **1.2 資料庫初始化**
|
||||
**目標**：建立測試用的詞卡資料
|
||||
|
||||
**任務**：
|
||||
- [ ] 建立種子資料（Seed Data）
|
||||
- [ ] 建立預設詞卡集合（如：商務英語、日常對話）
|
||||
- [ ] 建立範例詞卡（50-100 張）
|
||||
- [ ] 測試資料庫關聯完整性
|
||||
|
||||
---
|
||||
|
||||
### **第二階段：AI 生成功能 (1 週)**
|
||||
|
||||
#### **2.1 Google Gemini 整合**
|
||||
**目標**：實作從影劇對話生成詞卡
|
||||
|
||||
**後端任務**：
|
||||
- [ ] 測試 `GeminiService` 與 Google AI 連接
|
||||
- [ ] 實作 `AIController` 的生成端點
|
||||
- [ ] 配置 Gemini API 金鑰
|
||||
- [ ] 優化 AI 提示詞（Prompt Engineering）
|
||||
|
||||
**前端任務**：
|
||||
- [ ] 整合 `/generate` 頁面與 AI API
|
||||
- [ ] 實作影劇對話輸入介面
|
||||
- [ ] 實作生成詞卡結果展示
|
||||
- [ ] 實作生成詞卡儲存功能
|
||||
|
||||
**API 端點**：
|
||||
```
|
||||
POST /api/ai/generate-flashcards - 從對話生成詞卡
|
||||
POST /api/ai/analyze-difficulty - 分析詞彙難度
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
### **第三階段：學習功能 (1-2 週)**
|
||||
|
||||
#### **3.1 學習模式實作**
|
||||
**目標**：實作多種學習模式
|
||||
|
||||
**功能清單**：
|
||||
- [ ] **翻卡模式**：顯示英文→中文翻譯
|
||||
- [ ] **選擇題模式**：四選一題目
|
||||
- [ ] **拼寫模式**：聽音拼字
|
||||
- [ ] **間隔重複算法**：使用 SM2 演算法
|
||||
|
||||
**前端任務**：
|
||||
- [ ] 整合 `/learn` 頁面與學習 API
|
||||
- [ ] 實作學習模式選擇器
|
||||
- [ ] 實作學習進度追蹤
|
||||
- [ ] 實作學習結果回饋
|
||||
|
||||
**後端任務**：
|
||||
- [ ] 測試 `StudyController` 學習端點
|
||||
- [ ] 實作 `SM2Algorithm` 間隔重複
|
||||
- [ ] 建立學習工作階段（StudySession）
|
||||
- [ ] 實作學習統計記錄
|
||||
|
||||
---
|
||||
|
||||
### **第四階段：數據可視化 (1 週)**
|
||||
|
||||
#### **4.1 學習統計與儀表板**
|
||||
**目標**：提供詳細的學習分析
|
||||
|
||||
**功能清單**：
|
||||
- [ ] 學習進度圖表
|
||||
- [ ] 每日學習統計
|
||||
- [ ] 詞彙掌握度分析
|
||||
- [ ] 學習時間追蹤
|
||||
|
||||
**前端任務**：
|
||||
- [ ] 整合 `/dashboard` 頁面與統計 API
|
||||
- [ ] 實作圖表組件（Chart.js 或 Recharts）
|
||||
- [ ] 實作學習報告頁面
|
||||
- [ ] 實作成就徽章系統
|
||||
|
||||
**後端任務**：
|
||||
- [ ] 測試 `StatsController` 統計端點
|
||||
- [ ] 實作學習數據聚合
|
||||
- [ ] 實作成就計算邏輯
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ 開發工具與流程
|
||||
|
||||
### **開發環境**
|
||||
```bash
|
||||
# 啟動前端（localhost:3000）
|
||||
cd frontend && npm run dev
|
||||
|
||||
# 啟動後端（localhost:5000）
|
||||
cd backend/DramaLing.Api && dotnet run --urls=http://localhost:5000
|
||||
|
||||
# 查看 API 文檔
|
||||
http://localhost:5000/swagger
|
||||
```
|
||||
|
||||
### **錯誤監控**
|
||||
```bash
|
||||
# 查看後端日誌
|
||||
BashOutput(bash_id: "bfb3f6")
|
||||
|
||||
# 查看認證錯誤
|
||||
BashOutput(bash_id: "bfb3f6", filter: "Auth|Login|Register")
|
||||
|
||||
# 查看 API 錯誤
|
||||
BashOutput(bash_id: "bfb3f6", filter: "Error|Exception")
|
||||
```
|
||||
|
||||
### **API 測試**
|
||||
```bash
|
||||
# 健康檢查
|
||||
curl "http://localhost:5000/health"
|
||||
|
||||
# 測試認證
|
||||
curl -X POST "http://localhost:5000/api/auth/login" \
|
||||
-H "Content-Type: application/json" \
|
||||
-d '{"email": "test@example.com", "password": "testpass123"}'
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📋 第一階段詳細任務分解
|
||||
|
||||
### **Week 1：詞卡管理系統**
|
||||
|
||||
#### **Day 1-2：後端 API 測試與資料建立**
|
||||
- [ ] 測試所有 CardSets API 端點
|
||||
- [ ] 測試所有 Flashcards API 端點
|
||||
- [ ] 建立種子資料（Seed Data）
|
||||
- [ ] 驗證資料庫關聯
|
||||
|
||||
#### **Day 3-4：前端詞卡列表整合**
|
||||
- [ ] 建立詞卡 API 服務檔案
|
||||
- [ ] 整合詞卡列表顯示
|
||||
- [ ] 實作詞卡搜尋與篩選
|
||||
- [ ] 實作詞卡集合切換
|
||||
|
||||
#### **Day 5-7：詞卡編輯功能**
|
||||
- [ ] 實作詞卡新增表單
|
||||
- [ ] 實作詞卡編輯功能
|
||||
- [ ] 實作詞卡刪除確認
|
||||
- [ ] 實作批量操作
|
||||
|
||||
---
|
||||
|
||||
## 🎯 成功指標
|
||||
|
||||
### **第一階段完成標準**
|
||||
- [ ] 用戶可以瀏覽所有詞卡集合
|
||||
- [ ] 用戶可以新增/編輯/刪除詞卡
|
||||
- [ ] 詞卡資料正確儲存到資料庫
|
||||
- [ ] 前端頁面完全不使用 mock 資料
|
||||
|
||||
### **整體專案完成標準**
|
||||
- [ ] 用戶可以從零開始生成學習詞卡
|
||||
- [ ] 用戶可以進行完整的學習循環
|
||||
- [ ] 用戶可以查看學習進度和統計
|
||||
- [ ] 系統穩定運行，錯誤處理完善
|
||||
|
||||
---
|
||||
|
||||
## 📅 時程規劃
|
||||
|
||||
| 階段 | 時間 | 主要功能 | 里程碑 |
|
||||
|------|------|----------|---------|
|
||||
| 第一階段 | Week 1-2 | 詞卡管理 | 完整 CRUD 功能 |
|
||||
| 第二階段 | Week 3 | AI 生成 | Gemini 整合完成 |
|
||||
| 第三階段 | Week 4-5 | 學習功能 | 三種學習模式 |
|
||||
| 第四階段 | Week 6 | 數據分析 | 統計儀表板 |
|
||||
|
||||
---
|
||||
|
||||
## 🔧 技術考量
|
||||
|
||||
### **效能優化**
|
||||
- 實作詞卡分頁載入
|
||||
- 快取常用的詞卡集合
|
||||
- 優化 AI 生成回應時間
|
||||
|
||||
### **用戶體驗**
|
||||
- 響應式設計適配行動裝置
|
||||
- 載入狀態和錯誤提示
|
||||
- 鍵盤快捷鍵支援
|
||||
|
||||
### **資料安全**
|
||||
- 用戶詞卡資料隔離
|
||||
- API 端點權限控制
|
||||
- 敏感資料加密儲存
|
||||
|
||||
---
|
||||
|
||||
## 🚀 立即行動計劃
|
||||
|
||||
**今天就可以開始**：
|
||||
1. 測試現有的 CardSets API
|
||||
2. 建立第一個詞卡集合
|
||||
3. 在前端顯示真實的後端資料
|
||||
4. 實作基本的詞卡 CRUD
|
||||
|
||||
**預期成果**：
|
||||
在這個階段結束後，DramaLing 將從一個原型變成一個可用的詞卡學習應用，用戶可以管理自己的詞卡並開始基本的學習活動。
|
||||
|
||||
---
|
||||
|
||||
**建立日期**：2025-09-16
|
||||
**預計完成**：2025-10-27
|
||||
**開發者**：DramaLing Team
|
||||
|
||||
---
|
||||
|
||||
## 📖 相關文檔
|
||||
- [錯誤日誌監控指南](./error-logging-guide.md)
|
||||
- [API 開發文檔](./api/README.md)
|
||||
- [環境設置指南](./setup/README.md)
|
||||
Loading…
Reference in New Issue