Claude Code 的 Explore → Plan → Code → Commit 工作流程

🧑‍🏫 這支影片講的是用 Claude Code 做功能時，官方最推薦的做事順序：先探索、再規劃、才寫程式、最後提交。重點是別一開口就叫它寫程式，先花一點時間讓它看懂專案、列好計畫，後面要修改和重來的次數會少很多。

• 00:05 如果 Claude Code 只能記住一件事，就記住這個工作流程：explore（探索）、plan（規劃）、code（寫程式）、commit（提交）
  ↳ Claude Code 是讓 Claude 直接在你電腦上讀、改專案程式的工具。用它最該記住的是四步：explore 探索、plan 規劃、code 寫程式，最後 commit 提交，也就是把修改存成一個有紀錄的版本。
• 00:05 不照這個流程的話，多數人會直接叫 Claude 寫程式，之後就得花更多力氣修正方向（course correct）
  ↳ 很多人一開口就叫它直接寫。方向一錯，後面就得一直 course correct，也就是中途插手把它拉回正軌，反而更累。
• 00:05 處理第一步和第二步（探索、規劃）最快的方法是用 plan mode
  ↳ 前兩步最省事的做法是開 plan mode（規劃模式）。這個模式專門讓 Claude 先把探索和規劃做完。
• 00:05 在 plan mode 下，Claude 不能編輯檔案，只會讀檔案，研究這次實作該怎麼處理
  ↳ 在 plan mode 裡，Claude 只能讀檔案、不能改。就像裝潢前先請師傅來看現場、量尺寸，但還不准他動工。
• 00:05 進入 plan mode 的方法：一直按 Shift+Tab，直到輸入框下方出現 plan mode
  ↳ 在 Claude Code 的輸入框按 Shift+Tab，多按幾次，直到輸入框下方出現 plan mode 就對了。
• 00:36 示範的提示：要在圖片上傳流程（image upload pipeline）加入 WebP 轉換，請 Claude 找出應該放在流程的哪個位置、需不需要新的 dependencies，以及怎麼實作
  ↳ 示範的需求是讓上傳的圖片自動轉成 WebP（一種檔案比較小的圖片格式）。Claude 要找出該接在流程哪一步、要不要加 dependencies（專案得另外安裝的現成套件），還有怎麼做。
• 00:36 Claude 會讀相關檔案、做一些網路搜尋，然後給你一份行動計畫（plan of action）
  ↳ Claude 會自己翻相關檔案、上網查資料，最後交給你一份 plan of action，也就是一步步列好的執行計畫。
• 00:36 計畫一定要自己看過，確認符合你的標準；不符合就請 Claude 補充或修改某些部分
  ↳ 計畫別看都不看就按同意。自己讀過，確認符合你的要求；哪裡不清楚或不對，就請它補充或修改。
• 00:36 規劃階段是最適合修正方向的時候，因為這時還沒寫任何程式碼
  ↳ 這時候改方向最划算。因為還沒寫任何程式，改計畫只是改幾行字，不用把已經寫好的東西拆掉重來。
• 01:06 不進 plan mode 也能做探索，直接請 Claude 探索你的 code base 就行
  ↳ 不開 plan mode 也能探索。直接跟 Claude 說「幫我看一下這個 code base」就好，code base 就是整個專案的程式碼。
• 01:06 計畫沒問題後選 approve 接受，Claude 就會照它列出的項目逐一執行並打勾
  ↳ 計畫沒問題就按 approve（核准）。Claude 會照清單一項一項做，做完一項打一個勾，進度你都看得到。
• 01:06 你可以決定讓 Claude 自動接受檔案修改（auto accept），或每次修改都先問你
  ↳ 你可以開 auto accept，讓它改檔案時不用每次問你；也可以設成每次修改都先問過你。看你對它有多放心。
• 01:06 Claude 會盡量先排除 code base 裡的問題，才認定計畫完成，但有時候你還是得介入修正方向
  ↳ Claude 會先自己抓出程式裡的問題、修好了才說完成。但它不是每次都對，有時你還是得出手糾正。
• 01:06 這正是用 plan mode 的好處：計畫完成後，Claude 還保有「怎麼得到這些結果」的脈絡，能用來判斷下一步
  ↳ 先走過 plan mode 的好處是：Claude 記得自己一路是怎麼做到這裡的，所以出問題時，能靠這些來龍去脈判斷下一步。
• 01:36 Claude 要對結果有把握，就必須清楚知道怎樣才算正確，所以寫計畫時要把這點講明白
  ↳ Claude 要確定自己做對了，得先知道「對」長什麼樣。所以寫計畫時要把成功標準講清楚，例如圖片要成功轉成 WebP，而且能正常顯示。
• 01:36 加入能幫 Claude 達成目標的工具，可以省掉很多來回溝通
  ↳ 給 Claude 能自己檢查成果的工具，它就能自己驗證，不必每做一步都回來問你、等你幫它測。
• 01:36 例如做 web UI 時，要裝好 Claude and Chrome extension（字幕原文），讓 Claude Code 能控制分頁、先測過 UI 再認定完成
  ↳ 例如做網頁畫面時，裝好字幕裡提到的 Claude 的 Chrome 擴充功能。Claude Code 就能自己開分頁操作，把畫面測過才說完成。
• 01:36 專案裡要放一套 test suite，讓 Claude 可以持續拿來驗證
  ↳ 專案裡要放一套 test suite，也就是一組自動測試，一跑就知道功能有沒有壞。這樣 Claude 每改一次都能拿來檢查。
• 02:07 測試也可以交給 Claude 寫，但交給 Claude 前，要先確認這些測試是你和團隊都認可的標準（source of truth），避免 false positives
  ↳ 測試可以交給 Claude 寫，但要先確認它們是你和團隊認可的對錯標準（source of truth）。不然容易出現 false positive：測試顯示通過，其實東西是壞的。
• 02:07 小技巧：如果 Claude 一直卡在同樣的問題，請它把解法存進 Claude MD 檔
  ↳ 如果 Claude 老在同一個地方出錯，就請它把解法寫進 Claude MD 檔。這是 Claude 工作時會參考的專案說明檔，之後就比較不會再犯。
• 02:07 自己測過、對結果滿意之後，就可以 push 程式碼了
  ↳ 你自己實際測過、覺得結果沒問題，就可以 push 了，也就是把程式碼上傳到大家共用的程式庫。
• 02:07 commit 前的小技巧：先跑一個 subagent code reviewer 檢查你的程式碼
  ↳ commit 前有個小技巧：先派一個 subagent（另外派出去做特定工作的小幫手 Claude）當 code reviewer，幫你把程式碼檢查一遍。
• 02:07 接著讓 Claude 照你的風格產生 commit message，然後重複整個流程
  ↳ 接著請 Claude 照你平常的寫法產生 commit message，也就是說明這次改了什麼的紀錄文字。做完後，下一個功能再從頭跑一次這四步。
• 02:38 總結：explore 讓 Claude 拿到專案需要的相關脈絡；plan 產生一份行動計畫，Claude 會用它判斷自己有沒有成功
  ↳ 回顧前兩步：explore 是讓 Claude 先搞懂專案；plan 產出的計畫不只是步驟清單，也是 Claude 事後判斷自己有沒有做成的依據。
• 02:38 總結：code 是你和 Claude 來回調整、直到計畫定案的過程；commit 幫你 review 並 push 程式碼，接著就能開始做下一個功能
  ↳ 回顧後兩步：code 是你和 Claude 來回調整、直到計畫定案的過程；commit 負責檢查並上傳程式碼。收完尾，就能開始做下一個功能。

根據影片，在 plan mode 下 Claude 會怎麼做？