Capstone：從空資料夾做出一個可部署、可 Debug 的 Mini System

Learning outcomes

• 能把需求拆成 client/server/data boundaries。
• 能分階段實作並保持每階段可運作。
• 能建立 test/CI/deploy evidence。
• 能在 incident 中用 layer model debug。

1. Product Requirement

Course Workspace

User can:
- view courses
- create course
- edit own course
- delete own course
- sign in/out

不要一開始就選 framework。先把 capabilities 和 trust rules 寫清楚。

2. Architecture

Browser
  HTML/CSS/JS
    ↓ HTTPS
Course API
  validation/auth
    ↓
Database
  constraints/RLS

3. Phase 1：Static UI

HTML semantics
CSS responsive layout
JS local state

No backend yet

先讓 UI flow 成立，再引入 network complexity。

4. Phase 2：API / Data

GET /courses
POST /courses
PATCH /courses/:id
DELETE /courses/:id

Database:
courses(id, owner_id, title)

5. Phase 3：Auth / Security

authenticated user
  ↓
server verifies identity
  ↓
authorization
  ↓
RLS / constraints

用 user A/B/anon 測試，不只用 admin context。

6. Phase 4：Engineering

git commits
CI checks
build artifact
manual deploy
production smoke
rollback plan

Project checkpoint：Definition of Done

Feature:
critical flows work

Correctness:
unit/integration checks pass

Security:
A cannot edit B

Operations:
CI green
deploy traceable to commit
production smoke PASS

Debug:
request id / logs available

7. Required Incident Drill

刻意製造三個 bug：

• Frontend selector/null bug
• API 500/database schema bug
• Authorization/RLS bug

每一個都要保存 symptom → evidence → root cause → fix → regression。

8. Review Standard

你不需要一次寫出企業級系統；但你必須能回答每一層「誰在執行、input/output 是什麼、state 在哪、失敗怎麼看」。這就是 Foundations 真正的完成條件。