Antigravity / VS Code / Claude Code / Cursor
前面三篇都在講概念。
下一篇我們就要動手寫第一個網頁了。
但動手之前，
你的電腦裡要先裝對工具。
這篇我會用最誠實的方式講：
把我自己用過的工具，
從爛到好排成五個階段給你看，
順便講 2026 年完全新手要從哪個開始。
可以用，但你會很痛苦。
每改一個地方，
就要複製貼上一次。
檔案多了就找不到哪段在哪個檔。
所以這篇的核心：
選一個能讓 AI 直接在你電腦裡動手的工具。
網路上聲量最大的有這五個。
我都用過或追過，
講一下各自的個性。
2026 年初 Google 推出的 AI 開發環境，
主打「同時派多個 agent 做事」。
裡面內建的模型陣容很猛：
Gemini 3.1 Pro（High / Low）、Gemini 3 Flash、
Claude Sonnet 4.6、Claude Opus 4.6、GPT-OSS 120B —
幾乎把目前最強的模型都收進來了。
它最特別的是給 agent 三個執行面：
編輯器、終端機、瀏覽器，
而且可以一次派五個 agent 跑不同任務，
用 Manager 介面看誰在做什麼。
2026-03 v1.20.3 加上 AGENTS.md 規則檔支援跟 MCP 整合，
能接 GitHub、資料庫、外部 API。
價格（2026-03 起調整過，誠實講）：
・Free：有 rate limit，輕度試用 OK
・Pro：$20/月（跟 Cursor 同價）
・Ultra：$249.99/月（重度使用者）
・Pay-as-you-go：$25 / 2500 credits
2026-03 改價後社群有抗議「漲價」，
所以實際決定前去 antigravity.google/pricing 看最新版。
Cursor 是 Anysphere 出的 AI IDE，
2026-04-02 推出 Cursor 3，
整個介面從零重建，
核心理念從「寫程式」變成「管理 agent」。
新版重點：
・Agents Window：同時開多個 agent chat 並排看
・並行執行 + 雲端 agent 無縫接力
・Design Mode（內建設計工具）
・內建 git + 多 repo 支援
・改進的 diff 跟 PR workflow
價格沒變，Pro 仍然 $20/月。
它是目前最熱門、社群最大、教學最多的工具，
YouTube 上 vibe coding 影片九成都在用 Cursor。
VS Code 是微軟出的程式編輯器，
免費，全世界最多人用。
Claude Code 是 Anthropic 官方的 AI 編程工具，
跑在 terminal（命令列）裡。
它跟 VS Code 配在一起用，
是我前三個產品（脆脆王國 / NaLi Match / 火焰人）都靠的組合。
它跟 Cursor 最大差別：
Claude Code 是「終端機驅動」的，
你會看到一個黑底白字的視窗，
AI 在裡面跟你對話、跟你動檔案。
2026 年 4 月還在持續更新：
新增 /powerup 互動教學、
MCP 工具回傳上限拉到 50 萬字、
/cost 指令可看模型分項花費、
檔案 diff 速度提升 60%。
但學習曲線比較陡，
因為你要適應「在 terminal 裡跟 AI 對話」的感覺。
OpenAI 對標 Claude Code 的方案。
CLI、macOS 桌面 app、VS Code 擴充、Web 全部整合，
不管你用哪一端，
session 跟長任務都能延續。
模型主力是 GPT-5.2-Codex（2026-01 釋出），
SWE-Bench Pro 56.4%、Terminal-Bench 2.0 64.0%，
是目前長任務、跨檔案重構的指標模型。
還有 GPT-5.1-Codex-Max，
同強度下用少 30% 的思考 token，
更省錢。
計價變動，這個重要：
2026-04-02 起 Codex 改成「按 token 計價」取代原本的 per-message 計費（適用 Plus / Pro / Business）。
短任務變便宜，
但長任務 / 大檔案要記得看用量，
有用戶回報「單一 prompt 吃掉 7% 週限額」的案例。
2026-04 CLI 還補上 Windows sandbox、
ChatGPT device code 登入、
codex exec 支援 prompt + stdin。
我自己用過 Manus 的「雲端 agent 版」 —
那個版本能幫你跑長任務，
但有兩個讓我換掉的痛點：
1️⃣ 動不到我電腦裡每個檔案
產出結果還是要手動搬回專案。
2️⃣ 點數消耗快、燒錢燒很兇
那時候 Manus 是 credit 制，
跑一個複雜任務一次就掉一大塊額度，
想實驗就要一直加值，
對個人開發者長期不友善。
但這篇要補上 Manus 後來的反轉：
同時 Manus 也上了 Telegram 內的 personal agent，
掃 QR code 就能把它接進你的聊天，
WhatsApp / LINE / Slack 官方說「very soon」。
定價也從純 credit 制改成更貼近月費 + 訂閱層級的混合制，
對「想長期跑的人」友善很多。
但記得實際上線前還是看官方頁，
價格策略可能還會再動。
換句話說，
我當年抱怨「動不到電腦檔案」的痛點，
Meta 接手後補上了。
如果你是想要 AI 幫你「跨應用程式」做事的人（不是純寫 code），
新版 Manus 值得追蹤。
上面五個都是「裝在你電腦」的選項。
如果你連電腦都還沒打開、或只想 5 分鐘看到原型，
下面這四個是純瀏覽器就能跑的 vibe coding 工具，
各自有自己擅長的場景。
StackBlitz 出的網頁工具，
一個 prompt 跑出可運行的 React/Vite 專案，
內建即時預覽 + terminal + 一鍵部署到 Netlify。
給文字描述或設計圖，
回 production-ready 的 React + Tailwind + shadcn/ui 元件。
歐洲團隊出的「真正端到端」工具，
UI、後端、Supabase 資料庫、認證一條龍，
一鍵 push 到自己的 GitHub。
從 prompt 到「能在公網跑的網站」全部在瀏覽器內完成，
內建 hosting，做完直接給網址。
更多工具的詳細介紹（包含 Windsurf、Cline、Aider、Continue.dev、Copilot Workspace、Devin）
整理在這個系列的工具庫：
/series/tools/
UI 對新手友善、模型陣容齊全（Gemini + Claude 都有）、
Free tier 有 rate limit 但夠你判斷喜不喜歡，
確定要長期用再升 Pro $20。
裝完 Antigravity，
記得補兩個掛件（extension）：
如果你本來就有訂 Google AI Pro / Ultra，
記得用同一個 Google 帳號登入 Antigravity，
會解鎖更高的 agent 配額跟更多模型。
三個月後等你比較熟了，
會自己有偏好。
到時候再考慮要不要轉到 Cursor、Claude Code 或 Codex。
選擇順序我會這樣排：
每個工具的細節安裝步驟，
網路上都有詳細教學，
我這邊只給你一個整體流程感：
1. 去 Google Antigravity 官網註冊（用 Google 帳號登入）
2. 下載對應你系統的版本（Mac / Windows）
3. 打開後登入你的 Google 帳號
4. 在 Extensions / 掛件市集裝兩個必裝：
・Claude Code 掛件
・中文版掛件
5. 建一個新專案資料夾
6. 在裡面打開對話視窗，跟 AI 說話
1. 去 code.visualstudio.com 下載 VS Code，安裝
2. 註冊 Anthropic 帳號，訂閱 Claude Pro 或 Max
3. 在 terminal 安裝 Claude Code 指令工具
4. 用 VS Code 打開你的專案資料夾
5. 在 VS Code 內建 terminal 裡輸入 claude，開始對話
1. 去 cursor.sh 下載安裝
2. 註冊帳號（免費版有限制，付費版是 Pro）
3. 打開後登入
4. 開新專案資料夾，按 Cmd/Ctrl + L 叫出 AI 對話
細節步驟跟 AI 說「我要在 Mac 上裝 Antigravity / Cursor / Claude Code，請帶我一步一步做」。
它會比任何網路教學都精準。
不要這樣。
三個工具的差異，
對「還沒寫過第一個產品的你」來說，
差不多就是「都一樣好」。
選一個（我建議 Antigravity），
裝起來，
明天就可以動手寫 EP.5 的第一個網頁。
EP.0~3 講的那些觀念是地基，
工具只是地毯，
地毯可以隨時換，
地基決定你的房子能蓋多高。
下一篇我們就要動手了。
2026 年，你不會自己寫 HTML / CSS / JS 的語法 —
AI 一句話就生出來了。
所以 EP.5 教的東西很不一樣：
為什麼 AI 寫出來的網頁長那樣？
HTML、CSS、JS 為什麼要分三層？
知道分層是做什麼用的，
你才能精準叫 AI 改你想改的那一塊 —
「我要加一個按鈕」「按鈕變藍色」「按一下要彈訊息」
對應到三種完全不同的對話方式。
EP.5 教的是「跟 AI 講同一種語言」的最小知識集。
讓你下指令的時候，
AI 一次就改對。
可以。這幾個工具的設計都是讓你用自然語言下指令，AI 幫你寫實際的程式碼。新手也能用，差別只在學習曲線跟介面風格。
兩個都是 $20/月起的同價位選擇，UI 對新手都算友善。Cursor 是目前社群最大、教學影片最多的工具，新手有問題比較容易找到中文資源。Antigravity 的優勢是模型陣容齊全（Gemini + Claude 都收）跟多 agent 並行。
最大差別是介面風格——Claude Code 是「終端機驅動」的，會看到一個黑底白字的視窗，AI 在裡面跟你動檔案。學習曲線比較陡，但能跑最複雜的任務，1M context 跟 subagent 是它的強項。
兩個是同一類武器但不同陣營。Codex 是 OpenAI 對標 Claude Code 的方案，主力模型 GPT-5.2-Codex 在長任務跟跨檔案重構的表現好。如果你已經有 ChatGPT 訂閱可以直接用 Codex，沒有訂閱想用 Claude 系模型就選 Claude Code。
可以用，但每改一個地方就要複製貼上一次，檔案多了就找不到哪段在哪個檔。動手做產品的關鍵是讓 AI 直接在你電腦裡動手，這個 ChatGPT 網頁版做不到。