實測案例:文組 PM 靠 Cursor + Claude 兩天寫出全端網站,資深工程師看完 Code 沉默:「邏輯比我還嚴謹」
作者與來源揭露
- 作者
- Editorial Team
- 審核
- 由 CULTIVATE 編輯團隊完成最終審閱
- 生成模型
- gemini-3-pro-preview
- 主要來源
- SYSTEM_CLI
From the perspective of a Senior Developer Productivity Engineer, this article dissects a viral case where a non-technical Product Manager built a production-ready full-stack application in 48 hours using Cursor IDE and Claude 3.5 Sonnet. We analyze how Cursor's Composer mode outperforms traditional autocomplete, provide actionable prompt engineering tips, and share the latest release intel. Discover why the code's strict logic silenced a senior engineer and what this agentic workflow means for the future of software development.
作為一名專注於開發者生產力與 AI 工具鏈的工程師,我這週被指派審查一個特殊的 Repo。這不是來自我的資深團隊,而是一位「文組」出身的產品經理(PM)的週末專案。他宣稱用兩天時間,靠著 Cursor 和 Claude 3.5 Sonnet 寫完了一個具備完整前後端、資料庫串接與使用者驗證的網站。
起初我抱著「看笑話」的心態打開 VS Code,準備挑出一堆 Spaghetti Code(義大利麵式程式碼)、資安漏洞或寫死的變數。但在瀏覽了十分鐘後,我沉默了。
程式碼結構異常清晰。API 路由使用了標準的 RESTful 設計,型別定義(TypeScript Interfaces)嚴格對應資料庫 Schema,甚至連錯誤處理(Error Handling)都考慮到了邊界情況。這種「潔癖」般的邏輯嚴謹度,通常需要工程師具備 3-5 年的經驗才能養成。
這就是 Agentic AI(代理型 AI) 改變遊戲規則的時刻。
The Toolset: Cursor + Claude 3.5 Sonnet
Cursor 並非單純的「程式碼補完」工具,它是基於 VS Code 的 fork,但在核心整合了強大的 AI 上下文感知能力。搭配 Claude 3.5 Sonnet 模型,它不僅是「寫扣」,而是「理解架構」。
Workflow Integration: 從需求直達部署
在這個案例中,PM 的工作流完全顛覆了傳統 SDLC:
- 需求即程式碼:他沒有寫 Jira Ticket,而是直接在 Cursor 的 Composer(Cmd+I)視窗中貼上了 PRD(產品需求文件)。
- 架構生成:Claude 建議了 Next.js + Supabase 的技術堆疊,並自動規劃了資料夾結構。
- 迭代優化:當遇到 Bug 時,他不是去 StackOverflow 找答案,而是將錯誤訊息貼回 Chat,AI 自動讀取相關檔案並提出修復方案(Diff)。
Comparative Analysis: 為什麼是 Cursor 而不是 Copilot?
許多人問:「這跟 GitHub Copilot 有何不同?」
- Copilot 是戰術層面的。它擅長補完這一行,或預測下一個函式。它像是坐在你旁邊的初級工程師,手很快,但沒什麼大局觀。
- Cursor (Composer Mode) 是戰略層面的。它具備 Full Codebase Awareness(全域程式碼感知)。當你說「把所有按鈕改成圓角並更新 CSS 變數」時,它知道去修改
tailwind.config.js和相關的 Components,而不是只改當前檔案。這就是為什麼 PM 的專案能保持高度的一致性。
Release Intel: 掌握最新功能
要達到這種效果,你不能只把 AI 當聊天機器人。以下是基於 Cursor 最新更新的實戰技巧:
- 善用
.cursorrules(Pro Tip) 這是讓 AI 懂你的關鍵。PM 在專案根目錄放了一個.cursorrules檔案,裡面寫著:
- Always use TypeScript with strict mode.
- Use arrow functions for components.
- Style with Tailwind CSS.
- Prioritize readability over brevity.
這就像給了 AI 一本「團隊開發規範手冊」,強迫它產出的程式碼符合資深工程師的標準。
- Composer 的多檔案編輯能力 Cursor 的 Composer 功能允許 AI 同時編輯多個檔案。
- How-to-Use: 按下
Cmd+I(或Ctrl+I) 開啟 Composer,輸入 "Create a user profile page with an edit form, connect it to the /api/user endpoint, and update the navigation bar." - 結果: AI 會同時建立
page.tsx,form-component.tsx, 修改navbar.tsx並新增 API route。
Prompt Engineering Tips
PM 成功的關鍵在於他懂得「用邏輯說話」。
- 壞的 Prompt: "幫我做一個登入頁面。"
- 好的 Prompt (PM 的做法): "建立一個登入表單,包含 Email 和密碼欄位。使用 Zod 進行前端驗證。驗證通過後,呼叫 Supabase 的 auth API。若失敗,在欄位下方顯示紅色錯誤訊息。" 秘訣:把 AI 當作一個聽話但缺乏常識的實習生,指令越具體(Specific),結果越精確。
Limitations & Verdict
雖然程式碼品質驚人,但這不代表工程師要失業了。
- 幻覺風險:當專案規模變大,Context Window 爆滿時,AI 可能會開始胡說八道或引用不存在的 Library。
- 維護難題:PM 雖然「寫」出來了,但他可能不懂 為什麼 這裡要用
useEffect。一旦出現深層的邏輯衝突,Debug 的過程對非技術人員來說仍是地獄。
Verdict: Cursor + Claude 是 "Idea Multiplier"。它讓資深工程師能在一小時內完成一天的 CRUD 工作,也讓有邏輯能力的 PM 能跨越「語法障礙」直接產出產品。那位資深工程師的沉默,不是恐懼,而是意識到我們必須從「寫 Code 的人」進化為「審核與架構 Code 的人」。
🛠️ CULTIVATE Recommended Tools | 精選工具推薦
- Poe: Access all top AI models (GPT-4, Claude 3, Gemini) in one place.
Disclosure: CULTIVATE may earn a commission if you purchase through these links.