🔧 阿川の電商水電行
每週都有新的「面向開發者的AI」影片，但在實際專案中，問題其實很簡單：如何在不拖慢開發速度或將垃圾程式碼部署到生產環境的情況下使用這些工具？過去一年，我在使用大型Next.js前端和Python FastAPI後端進行開發時，發現以下幾種模式一直行之有效。
這是我當初開始將 Zed 與 Claude 和 Gemini 結合使用，作為日常工作流程的一部分時，希望擁有的操作指南。
-
始終使用兩種人工智慧工具，而不是一種。
首先，我把人工智慧工具當作基礎設施來對待，這大大提高了我的工作效率：絕不允許單點故障。在實踐中，這意味著要執行：
-
Zed 編輯器，支援內嵌編碼、重構和本地上下文。
-
使用 Claude 或 Gemini 作為您的代理/聊天層，進行規劃、多檔案變更和架構討論。
為什麼這對實際工作很重要：
-
速率限制和故障總是會發生，而且總是在最糟糕的時候。有了這兩款工具，你只需切換上下文即可繼續出貨。
-
不同的工具各有優勢：Zed 非常適合作為快速編輯環境；Claude 和 Gemini 更擅長倉庫級推理和智能體工作流程。
如果你的整個工作流程都依賴單一的人工智慧產品，那麼稍有不慎，你就可能最終一無所獲。
-
不要將人工智慧用於3分鐘內完成的任務
一條幫我節省大量時間的鐵律：如果手動解決一個任務只需要不到 3-4 分鐘，就不要呼叫 AI。例如：
-
重命名變數。
-
新增一個條件語句。
-
修正明顯的拼字錯誤或匯入錯誤。
啟動一個智能體、解釋上下文並等待它產生方案，比自己直接輸入解決方案慢得多。人工智慧的優點在於：
-
此次更改涉及多個文件。
-
你需要探索各種方案或特殊情況。
-
這項工作包括計劃和實施。
在人工智慧能夠減輕認知負荷的地方使用人工智慧，而不是在它為簡單任務增加繁文縟節的地方使用人工智慧。
-
先進入計劃模式，然後再讓代理程式執行
現代工具和工作流程越來越依賴「計劃模式」的概念。在這種模式下，代理程式：
-
讀取您的程式碼倉庫。
-
提出分步驟的計劃。
-
列出它想要修改的文件以及它將要更改的內容。
我的工作流程：
-
請像提交正式工單一樣描述問題：當前行為、期望行為、限制條件、極端情況。
-
強制代理保持規劃模式，直到規劃方案看起來像是你會分配給初級開發人員的方案。
-
只有到那時才能說「好的，執行這個計劃」。
事先做好計劃可以多花幾分鐘時間，但能大幅減少差異中可能出現的意外情況。
-
從程式碼庫提供真實上下文
「一般般」的AI輸出和「哇，這真有用」的AI輸出之間最大的區別在於上下文。在Next.js + FastAPI環境中使用智能體處理某個功能時：
-
貼上或連結到類似的現有實作（例如，「複製公共事件的實作方式並重複使用該模式」）。
-
請提及相關頁面、API 路由、服務或功能標誌。
-
明確指出諸如「不要修改此支付代理」或「必須與現有 API 保持向後相容」之類的限制條件。
這些工具非常擅長複製程式碼庫中已存在的模式。如果你不指定它們使用哪些模式，它們就會樂於建立新的模式，從而增加程式碼庫的熵值。
-
讓代理商非同步工作，同時你可以去做其他事情
觀看經紀人工作，前兩次還挺有意思，之後就完全扼殺效率了。一旦方案獲批，經紀人就開始修改：
-
把它放在背景裡。
-
再接一個小型任務、審核或計畫單。
-
等待通知或完成訊息。
把人工智慧當作值得信賴的隊友，讓它嚴格按照規範執行任務，而不是盯著螢幕看。支援非同步代理執行和通知的工具正是在這方面大放異彩。
-
讓AI存取完整流程（前端+後端）
大多數實際問題並非“純前端”或“純後端”。競賽流程、結帳或使用者引導通常涉及：Next.js 頁面、React 元件、FastAPI 路由、資料庫、功能開關和分析。如果你的代理只能看到部分訊息，那麼它將：
-
前端問題解決了，但後端驗證卻沒做好。
-
修復 API，但忽略 UI 邊緣狀態。
因此，對於多部件設定：
-
將所有相關目錄新增至 AI 工作區（Next.js 應用程式、FastAPI 後端、共用程式庫）。
-
明確指定該功能的起始位置和結束位置（「從此登入頁面到此 FastAPI 端點和資料庫表」）。
全局視野越清晰，就能實現越全面的「端到端」變更。
-
像資深工程師一樣審查差異
最糟糕的做法就是將人工智慧的輸出視為「可信程式碼」。在智能體完成操作後：
-
在編輯器或原始碼控制管理 (SCM) 工具中開啟差異，並像初級開發人員審查拉取請求一樣進行審查。
-
尋找不必要的抽象、重複的邏輯和細微的行為變化。
-
手動執行測試並逐一查看關鍵流程。
人工智慧並不了解你的業務、你的服務等級協定 (SLA)，或是那個一旦欄位類型改變就會崩潰的 CEO 控制面板。這些判斷仍然由你負責。
-
也用人工智慧來審查你自己的程式碼
一個被低估的應用場景：AI 作為程式碼審查工具。提交更改後：
-
請另一位代理人（不是編寫程式碼的代理人）審查最後一次提交或拉取請求。
-
讓它專注於極端情況、性能、錯誤處理和安全性。
-
將回饋意見當作第二雙眼睛來審視，而不是最終的權威依據。
這種雙重代理模式可以捕捉到你因為身處變化之中而忽略的問題。
-
明確人工智慧不能觸及的領域
每個重要的生產系統都有「零容忍」區域：支付路由、租戶隔離、身份驗證、關鍵基礎設施配置。對於這些區域：
-
要嘛完全不讓特工碰他們，要嘛
-
強制進行範圍極小、改動幅度很小的變更，並輔以大量的人工審核。
公共登入頁面當機 5 分鐘尚可接受；但如果由於代理錯誤地重構了共享中間件，導致多租戶配置中的資料外洩到各個客戶之間，那就不可接受了。經驗法則：
-
使用人工智慧處理你已經很熟悉並且能夠自己實現的程式碼。
-
利用人工智慧對未知領域進行概念驗證，然後回頭重新實施或進行深度審核。
這種思維方式使人工智慧成為一種力量倍增器，而不是生產事故的隱形根源。
在將人工智慧更深入融入工作流程之前
如果你是高級開發人員或技術主管，目標不是“到處使用 AI”，而是“以更少的腦力負擔和風險交付更多價值”。在 Zed 中，Next.js + FastAPI 技術堆疊的最佳配置如下：
-
兩個互補的工具：Zed 作為編輯器，Claude 或 Gemini 作為代理/聊天大腦。
-
嚴格禁止將 AI 用於瑣碎的修復或極其關鍵的程式碼路徑。
-
以計劃為先、上下文豐富、非同步的工作流程，其中代理人負責繁重的工作，而您負責思考和審查。
有了這種心態，人工智慧就不再是玩具或威脅，而是變成了它應該成為的樣子：一個速度非常快、非常聽話的初級開發人員，它永遠不會疲倦——但在任何東西投入生產之前，總是需要你的判斷。
原文出處：https://dev.to/rio14/how-i-actually-use-ai-agents-as-a-senior-frontend-dev-without-breaking-prod-1g1
1) --- 會變成分隔線（上一行必須是空白）
2) # 會變成一級標題
3) ## 會變成二級標題
4) ### 會變成三級標題
5) **粗體文字**會顯示粗體文字
6) ```當第一行與最後一行會顯示程式碼
7) 請搜尋 Markdown 語法，了解各種格式
