Cursor 2 Vibe Coding 開發手冊

＜內容簡介＞ 從碼農變 Agent 指揮官 From Coder to Commander |> Agent！Agent！Agent！ 從 Cursor 2.0 開始，已經從附帶 AI 功能的程式碼編輯器晉升為附帶編輯器的 AI 神器，從程式碼為核心轉變為以 Agent 為核心的開發方式，過去開啟 Cursor 當碼農寫 Code，現在開啟 Cursor 指揮 Agent 依照你提供的規格與要求生成程式碼，你將成為名副其實、具有技術專業的程式『設計』師，而不是勞心又勞力的鍵盤俠。 |>用 Plan 模式實踐 SDD AI Agent 幫你寫 Code、寫文件、除錯、改進效能，因此開發者們才有時間好好專注產品需求、規格，SDD（Spec-Driven-Development）從來就不是新玩意兒，Cursor 提供了 Plan 模式可以協助我們把懶得寫、來不及寫的規格寫好，讓程式碼與文件不脫節。 |>內建瀏覽器就是神 不用安裝 Playwright MCP 伺服器，也不用在本機瀏覽器和 Cursor 之間切換，Cursor 自帶內建瀏覽器，測試/除錯超便利，還附加視覺編輯器，直接動手所見即所得（WYSIWYG）調網頁，讓 Agent 幫你把變動更新回網頁檔，不用自己找 HTML/CSS 檔慢慢改。 |>找 Cloud Agent 當雲端碼農 臨時想起來要修 Bug？就算在外面只有手機也沒關係，透過 Cloud Agent 網頁，隨時都可以啟動 Agent 做事，做完還會發 PR 給你，合併進來還會自動啟動 Bugbot Agent 幫你審查程式碼，（驚！）以後無法再說手邊沒電腦，沒辦法改 Code 了。 |>進 Debug 模式召喚 AI 除錯 大膽假設、小心求證是除錯的不二法門，你可能需要到處 print 變數值、或是確認程式是不是會執行到某個點，即使有 IDE 的除錯器幫忙，也還是要辛苦的邊按鈕控制流程邊眼觀四面。Cursor 的 Debug 模式 Agent 可以幫你提出假設、埋 log，在重現問題的過程中蒐集資訊驗證假設，找出問題並且修正。 |>Cursor CLI 高效改專案 Cursor 伴隨有命令行模式的 Cursor CLI，即便是只有主控台終端機可用的伺服器環境，或是只能 SSH 遠端登入也能用，免去對系統負擔較重的使用者介面，只要動動手指敲鍵盤輸入文字就可以指揮 Agent，簡單快速。 |>實戰演練見真章 Vibe coding 說得再響亮，做不出成果也枉然，本書內含三個實戰演練專題，手把手帶你跟 AI 協作出 YouTube 影片英文聽打練習、PDF 翻譯神器、跨平台音樂節奏遊戲，AI 有對有錯，過程中除了如何描述需求與規格，更重要的是如何把 AI 做歪的結果掰正，每個專案都有滿滿的經驗分享。 ★本書特色： - 聚焦 Cursor 2.0 以 Agent 為核心的開發方式 - 制訂本機/遠端規則讓 Agent 照規矩辦事 - 用 Plan 模式實踐 SDD 先講好規格再生成程式碼 - 善用內建瀏覽器測試/除錯網頁應用 - 同時啟動多個 Agent 讓不同模型來比稿找出最佳設計 - 視覺編輯器直覺修改網頁 - 使用 MCP 快速設計前端介面 - 整合 Github 協作、讓 Bugbot 自動審閱提交內容 - 建立 Hook 彈性通知並設立防線避免 Agent 出狀況 - 使用 Cursor CLI 在終端機快速改程式 - YouTube 聽打練習、PDF 翻譯神器、音樂節奏遊戲實戰演練 ★目錄： 第 1 章 Cursor 簡介與安裝 1-1 Cursor 的 Vibe Coding 功能 Cursor 2.0 的大躍進--Agents 介面 Cursor 2.0 的強化功能--多模型支援與並行處理 1-2 安裝 Cursor 下載並安裝 Cursor 註冊 Cursor 帳號 設定 Cursor 外觀 1-3 牛刀小試--安裝 uv 與 Node.js 建立專案資料夾 指揮 Agent 幫我們安裝工具 安裝中文介面 1-4 付費訂閱會員 第 2 章 Cursor 快速入門：以設計猜數字遊戲為例 2-1 跟 AI 交談聊出專案--設計文字模式的猜數字遊戲 開啟舊專案 建立新的 Agent 用交談方式說明需求 修正 AI 的工作規劃 測試程式 2-2 與 AI 協作的除錯方式 把錯誤描述清楚的除錯法 幫遊戲上色 使用檢查點回復檔案內容 用 @ 引用功能讓 Agent 看問題畫面 2-3 請 AI 幫忙審查程式 審查 Agent 目前的工作結果 讓 Agent 幫忙找碴修 issue 2-4 請 AI 寫文件 讓 Agent 根據實作成果撰寫規格書 讓 Agent 根據規格書回頭撰寫產品需求書 2-5 查看 Token 用量與費用 查看 context window 用量 查看費用 用光額度怎麼辦？ 第 3 章 深入 Agents 模式 3-1 制訂 Agent 需要遵守的規則 Rules--專案的規範 撰寫產品需求書（PRD）與規格書（Specification） 依據 PRD 實作 測試與除錯 依據實作結果修改 PRD 3-2 先規劃再動作的規劃模式（Plan Mode） AGENTS.md--簡化版的專案通用規則 使用規劃模式（Plan Mode）妥善規劃再實作 使用內建瀏覽器工具自動驗證成果 3-3 使用平行 Agent 管理專案的不同版本 使用 Best-of-N 比較不同模型 提交目前成果 使用平行 Agent 臨時解問題/加新功能 清理工作樹 3-4 Agent 設定與模型選擇 取消分享資料給 Cursor 訓練 帳號管理 版面配置與工作樹設定 工具執行授權方式 禁止自動刪除檔案 變更可選用的模型清單 第 4 章 用 MCP 讓 Cursor 如虎添翼 4-1 什麼是 MCP？ MCP 的架構 MCP 的訊息傳輸方式 在 Cursor 中安裝 MCP 伺服器 4-2 使用 Browser 測試網頁應用程式 下載「旗標購物網」專案 進行自動化測試 設定自動化測試的 Agent 除錯處理 4-3 Figma MCP－設計前端介面的好幫手 參考設計風格 選取元素來進行設計 利用 Agent 來實作能重複使用的元件 第 5 章 Cloud Agent 與 Bugbot 在 Cursor 中的協作 5-1 專案下載與基本 Git 操作 專案下載 Cursor 中 Git 的基本操作 使用遠端規則限制 Cursor 自動產生的提交訊息格式 5-2 使用 Cloud Agent 進行專案實作 Web 版 Cloud Agent 掌握 Cloud Agent 的關鍵特性 實作文件歸納切卡機 5-3 Bugbot 的啟用、規範與實測 Bugbot 的計費與使用限制 啟用 Bugbot 的方法 規範 Bugbot 審查行為注意事項 實作各層級的 BUGBOT.md 規範檔 實測 Bugbot：驗證 BUGBOT.md 規範是否生效 第 6 章 Agent 的防線：Hook 6-1 什麼是 Hook? Hook 的執行流程 為什麼需要 Hook？ Hook 的種類 6-2 保護資訊外洩的防線–-beforeSubmitPrompt Hook Hook 完整的運行流程 在專案中建立 Hook 設計 Hook 觸發時要執行的指令-–阻止送出敏感資訊 測試 Hook 有沒有阻止送出敏感資訊 6-3 建立 beforeReadFile Hook–-阻止 Agent 讀取特定檔案 Hook 完整的運行流程 新增第二個 Hook Hook 觸發時要執行的指令-–保護重要檔案不被 Agent 讀取 測試 Hook 有沒有保護重要檔案 6-4 建立 Stop Hook–在 LINE 上收到提醒通知 Hook 完整的運行流程 新增最後一個 Hook Hook 觸發時要執行的指令-–發送提醒通知到 LINE 測試 Hook 有沒有順利發送 LINE 通知 第 7 章 實戰範例：YouTube 影片英文聽打練習 7-1 設計應用程式功能與架構 構思專案功能 設定最初的專案規則 與 Cursor 討論專案架構 7-2 實作應用程式主功能 首次執行並除錯 7-3 應用程式測試與優化 使用 Browser 進行測試 優化應用程式 7-4 完善其他功能 加入歷史紀錄的管理分類功能 加入 AI 解說功能 7-5 使用視覺編輯器調整 UI 介面 選取元件下達指令 使用 CSS Inspector 調整屬性 拖曳元件來重新排列 第 8 章 實戰演練：從 0 開始打造 PDF 翻譯器 8-1 用簡單提示內容生成程式 開始生成程式 初步測試 與 Agent 交談除錯 Debug Mode：為除錯而設計的 Agent 指定解決方法 8-2 重做 PDF 翻譯器：用規格書寫程式 從舊專案生成新版規格書（Spec） 實際生成程式碼 驗證和除錯 結論 第 9 章 實戰範例：音樂節奏桌面遊戲 9-1 與 Agent 聊出專案所需文件 準備遊戲畫面草圖與音樂檔案 與 AI 共同設計遊戲 請 Agent 撰寫音樂遊戲規格書 9-2 用規格書.md 實作 MVP 版本 Plan 模式實作專案 手動進行遊戲測試 9-3 遊戲程式的除錯與優化 讓 Agent 自行找出問題點並解決 提供 Agent 參考圖以調整遊戲畫面 Ask / Plan / Agent 模式混用以優化遊戲 第 10 章 Cursor CLI 與常用指令 10-1 在 Windows（WSL）/ macOS / Linux 使用 Cursor CLI 讓 Cursor 幫你安裝 WSL 安裝 Cursor CLI 在 Cursor CLI 使用 Agent 10-2 用 Cursor CLI 互動模式優化音樂遊戲 使用斜線指令進行專案前置作業 Plan 模式替音樂遊戲新增功能 其他常用斜線指令 10-3 常用 cursor-agent 子指令與參數說明 常用子指令 常用參數 10-4 Cursor CLI 無頭模式 無頭模式相關參數 讓 Agent 上網搜尋資料 讓 Agent 分析檔案用途並協助整理 10-5 用 Cursor 開啟 WSL 中的專案 建立 Cursor 與 WSL 的遠端連線 從 WSL 直接開啟 Cursor