用自然語言描述、AI 生成程式碼，你負責判斷與把關。這份地圖告訴你：從 idea 到上線，每一層該用什麼工具、解決什麼問題、何時才真的需要它。
Vibe coding 的核心不是「讓 AI 隨便改程式」，而是一條受控流程。AI 是被放進既有軟體交付流程裡的執行者——它能改程式，但 Git、PR、CI、部署與監控，才是讓這些修改「可追蹤、可審查、可回復」的骨架。
把自然語言變成程式碼。App builder 或本地 AI 編輯器。
程式碼時光機 + 協作控制台。PR 是防 AI 污染主線的關卡。
Postgres + Auth + Storage 一站搞定後端八成需求。
git push 後自動上線。Vercel / CF Pages / Railway / VPS。
網域、CDN、SSL、防護——產品的隱形入口層。
知道有人用（Analytics）、知道哪裡壞了（Sentry）。
安全第一條守則：OWASP 特別點名——許多人讓 agent 在 auto-accept 模式下、用開發者完整權限執行且無人監督，這是最大風險。最低限度：每次修改前先開 branch、改完看 diff、跑測試後才 commit，別讓 AI 一次改 30 個檔案才檢查。
Antigravity 遷移提醒：依 Google 官方 release notes，Gemini CLI 與 Gemini Code Assist IDE extensions 將於 2026-06-18 起停止為個人版（Code Assist for individuals、AI Pro、AI Ultra）服務，建議遷移到 Antigravity / Antigravity CLI。
commit 等於拍一張快照，出錯可隨時回到之前任一時間點。repository（倉庫）、commit（快照）、branch（分支）、diff（看 AI 改了什麼）、merge（合併）、revert/reset（改壞救回）。git push。協作節奏：AI 每完成一個小任務 → 你看 diff → 跑測試 → commit。剛起步不用先懂 merge conflict，先把「init → add → commit → push」跑熟，其他用到再學。GitHub 免費方案：public / private repo 無限、GitHub Actions 2,000 分鐘/月。
三大致命錯誤：① 關掉 RLS → 使用者讀到別人的資料；② 把 service role key 放前端 → 重大資料外洩；③ 讓 AI 自動改 schema → 破壞資料結構。正解：所有表預設開 RLS（用 auth.uid() 限制只能動自己的資料）、service key 只放 server、migration 一律人工 review、dev/prod 分開。
何時才需要 VPS？只是靜態站 / landing → Cloudflare Pages 或 Vercel；只是表單 + 登入 + CRUD → Supabase。需要長駐程序、Docker、WebSocket、背景任務、自架 n8n/PostHog 才上 VPS。先用 PaaS，等有真實用戶、成本上升再評估遷移。
在 Namecheap / Google Domains 等購買。
把域名的 nameserver 指向 Cloudflare（如 ns1.cloudflare.com）。
Cloudflare DNS 加一筆 CNAME：Target = Vercel 給的 cname.vercel-dns.com。
Vercel → Domains 加入域名，等 DNS 傳播完成（最多數小時）。
service role key 不進前端；AI 不碰 production secrets；dev / staging / prod 環境變數分開（.env.local → GitHub Secrets → 平台 env vars）。順帶防爆帳單：用 AI agent 時，Cloudflare AI Gateway 可快取與監控 AI 請求，防止 vibe coding 過程中因死循環引發高額 API 帳單；AWS 第一次用務必設 Billing Alerts。
不是每層 MVP 都必需。下表幫你判斷「哪些現在就要、哪些用到再說」。
| 比較項目 | AI Agent | Git/GitHub | Supabase | 部署 | Cloudflare | 觀測 |
|---|---|---|---|---|---|---|
| 解決的問題 | 寫程式 | 版本/協作 | 資料/登入 | 上線 | 網域/安全 | 監控 |
| MVP 必需 | ✓ | ✓ | 看需求 | ✓ | DNS 需要 | 建議 |
| 免費起步 | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
| 主要風險 | 權限 / 不看 diff | — | RLS / key 外洩 | — | — | secrets 外洩 |
| 初期可跳過 | 否 | 否 | 純靜態站可 | 否 | 僅 DNS | 可稍後 |
數值為 2026-06 對齊，方案常變動，以官方頁面為準。
| 工具 | 免費方案 | 付費起點 |
|---|---|---|
| GitHub | public / private repo 無限、Actions 2,000 分鐘/月 | — |
| Cursor | 免費版（基礎補全） | Pro $20/月 |
| Supabase | 500 MB DB、50K MAU、2 專案（閒置 7 天暫停） | $25/月 |
| Vercel | Hobby（個人 / 學習） | Pro $20/月 |
| Cloudflare | DNS / CDN / SSL / Pages / Workers(10 萬req/日) | Pro $20/月 |
| GoatCounter | 非商業免費 / 自架免費 | $15/月（商業） |
| Plausible | 自架開源（AGPL） | $9/月（10K pv） |
| Umami | 自架免費 / Cloud 100 萬 events/月 | 依用量 |
| Sentry | 免費層 | 依用量 |
| AWS | Always Free + 首年 12 個月免費（分三類） | 用量制 ⚠️ 設 Billing Alert |
$0/月 Starter Stack：Cursor（免費）或 Bolt.new ＋ GitHub ＋ Supabase ＋ Vercel ＋ Cloudflare ＋ GoatCounter。全部加起來 $0/月，只需買域名（約 $10–15/年）。有真實用戶後再升 Supabase $25、Vercel $20、Plausible $9。
不要一次學完所有工具；先依你要做的東西，挑一條最小可行路徑走完。
不需要：資料庫、登入、VPS、AWS、複雜後端。
適合：todo / kanban、會員系統、表單產品、AI wrapper、內部 admin。
適合：爬蟲/排程、自架 n8n/PostHog、WebSocket 即時協作。代價：要自己管 Linux、SSH、防火牆、備份、更新。
有團隊、有合規、有大量流量、需多區域部署才上；只是 MVP 用這套是過度工程化。
初學者學習順序：① 先會「不把專案弄壞」（Git commit/branch/diff、PR、.env/.gitignore）→ ② 讓產品能上線（部署 + DNS + Supabase）→ ③ 讓產品能維護（Actions + Sentry + staging + billing alert）→ ④ 再考慮 VPS / AWS（Linux + Docker + 備份還原）。
本頁由三份獨立草稿（Claude / Gemini / GPT 各自產出）交叉彙整：取最完整涵蓋、保留官方第一手引用、分歧處以權威來源為準。