電商儀表板文檔

主題

文檔索引與導航 ​

📖 文檔概覽 ​

本索引提供完整的文檔導航，按角色和開發階段分類，幫助不同背景的用戶快速定位所需資訊。

📋 文檔維護: 查看 文檔健檢報告 了解文檔分類、過時檢查與定期維護流程

👥 按角色導航 ​

產品經理 / 業務分析師 ​

👨‍💻 前端開發者 ​

後端開發者 ​

DevOps / 運維工程師 ​

🧪 測試工程師 ​

UI/UX 設計師 ​

按開發階段導航 ​

規劃階段 ​

01-planning/
├── prd/                     # 產品需求
│   ├── features.md          # 功能規格
│   ├── overview.md          # 專案概覽
│   ├── personas.md          # 用戶畫像
│   ├── success-metrics.md   # 成功指標
│   └── user-flow.md         # 用戶流程
├── project-plan/            # 專案計劃
│   ├── feature-milestones.md # 開發里程碑
│   └── gantt-chart.md       # 時程規劃
└── react-appendix.md        # React 技術差異

開發階段 ​

02-development/
├── architecture/            # 系統架構
│   ├── api-design.md        # API 設計
│   ├── architecture.md      # 整體架構
│   ├── component-map.md     # 元件結構
│   ├── data-flow.md         # 資料流
│   ├── CHART_ARCHITECTURE.md # 圖表架構
│   └── REALTIME_MIGRATION.md # 即時功能遷移
├── api/                     # API 文檔
│   └── notification-system.md # 通知系統
├── components/              # 元件文檔
├── database/                # 資料庫設計
│   ├── notification-system/ # 通知系統完整文件
│   │   ├── README.md        # 系統概述與導航
│   │   ├── sql-migrations/  # SQL 遷移檔案
│   │   └── architecture/    # 架構與開發文件
│   ├── supabase-integration.md # Supabase 集成說明
│   ├── dashboard-analysis.md # 分析報告
│   ├── erd.puml             # 關係圖
│   ├── rls-policy.md        # 安全政策
│   └── schema.sql           # 資料庫結構
└── design/                  # 設計規範
    ├── chart-visual-guidelines.md
    └── onboarding-flow.md

運維階段 ​

03-operations/
├── deployment/              # 部署文檔
│   ├── DEPLOYMENT.md        # 部署指南
│   ├── ci-cd.md            # CI/CD
│   ├── cloud-deploy.md     # 雲端部署
│   └── docker-guide.md     # Docker
├── database/                # 資料庫運維
│   └── README.md           # 運維指南
├── testing/                 # 測試策略
└── monitoring/              # 監控設定

📖 使用指南 ​

04-guides/
├── user-guide/              # 使用者指南
├── dev-guide/              # 開發者指南
├── demo-tools/             # 演示工具
│   ├── faker-seed.md       # 測試資料
│   ├── usage-guide.md      # 使用說明
│   └── mock-data-guide/    # 模擬資料
├── testing-tools/          # 測試工具
│   ├── front-stage-setup.md     # 前台測試環境
│   ├── test-data-generation.md  # 測試數據生成
│   ├── customer-simulation.md   # 客戶行為模擬
│   ├── integration-testing.md   # 整合測試流程
│   ├── performance-testing.md   # Vue 3 壓力測試指南
│   ├── load-testing-scenarios.md # 負載測試場景設計
│   └── performance-monitoring.md # 效能監控與警報系統
├── onboarding/             # 新手指南
│   ├── ui-components.md    # UI 元件
│   └── walkthrough.md      # 快速上手
├── dev-notes/              # 開發筆記
│   ├── CHART_COMPOSABLE.md
│   ├── NOTIFICATION_LIB_USAGE_GUIDE.md
│   └── ... (其他開發筆記)
└── project-info/           # 專案資訊
    ├── README.md
    ├── tech-stack.md
    └── vue-tech-stack.md

參考資料 ​

05-reference/
├── standards/               # 開發標準
│   ├── error-handling-guide.md # 錯誤處理
│   ├── ARCHITECTURE.md      # 架構參考
│   ├── NOTIFICATION_TYPE_ARCHITECTURE.md
│   └── ... (其他標準文檔)
└── ai-collaboration/        # AI 協作指南
    └── README.md

🔍 快速查找 ​

按功能分類 ​

通知系統 ​

圖表系統 ​

📈 分析系統 ​

開發工具 ​

⚡ 效能測試工具 ​

🔐 權限與認證 ​

Supabase 專屬文檔 ​

詳細的 Supabase 操作指南位於 supabase/docs/ 目錄，以下為快速導航：

📈 效能優化 ​

文檔關係圖 ​

mermaid
graph TD
    A[產品需求 PRD] --> B[技術架構設計]
    B --> C[API 服務設計]
    B --> D[資料庫設計]
    B --> E[元件架構設計]
    
    C --> F[通知系統]
    E --> G[圖表系統]
    
    F --> H[前端實作]
    G --> H
    D --> H
    
    H --> I[測試策略]
    H --> J[部署指南]
    
    K[錯誤處理標準] --> H
    L[開發最佳實踐] --> H

文檔維護 ​

文檔更新流程 ​

  1. 新功能開發: 同步更新相關技術文檔
  2. 架構變更: 更新架構設計文檔和相關引用
  3. Bug 修復: 更新錯誤處理和故障排除文檔
  4. 版本發布: 更新部署指南和變更日誌

文檔審查週期 ​

  • 每月審查: 檢查文檔準確性和連結有效性
  • 每季更新: 整合新功能文檔和最佳實踐
  • 版本同步: 確保文檔版本與程式碼版本一致

文檔品質標準 ​

  • ✅ 清晰的結構和導航
  • ✅ 實用的程式碼範例
  • ✅ 完整的交叉引用
  • ✅ 定期的內容更新
  • ✅ 多角色的使用指導

🆘 快速求助 ​

常見問題解答 ​

聯絡資訊 ​

  • 技術問題: 查看相關技術文檔或開發筆記
  • 業務問題: 參考產品需求文檔
  • 部署問題: 查看運維文檔

建立日期: $(date "+%Y-%m-%d")維護週期: 每月更新