最近我用 Vibe Coding 的方式做了一個 side project,叫做 Smart Segment。
這是一個可以上傳 CSV、快速分析特徵影響力的小工具,幫助你找出「哪些欄位可能對轉換率(conversion)有明顯區別效果」。特別適合用在二元分類任務中做特徵選擇,不需要手動跑統計檢定,也能快速篩出值得關注的變數。
雖然我沒有前端開發的背景,但這次透過 Cursor 搭配 AI 自動生成程式碼的方式,就算不熟 React 和 CSS,也能在短時間內做出一個能實際運作的工具。以下是我在這個過程中累積的一些實作心得與小技巧,希望對也想透過 Vibe Coding 完成 side project 的你有些幫助:
Vibe Coding 開發過程中的實用技巧
1. 先釐清需求再下去做,能大幅減少來回修正的時間
我一開始只是想「做一個網站」,但做到一半才發現,我其實希望這個網站是可以被 Google 搜尋到的。如果想達到這個目的,網站的架構就必須採用有利於 SEO 的網站實作方式,例如使用適合的渲染方式讓 Googlebot 能讀到內容。
然而,AI 最初幫我產出的網站是使用 React 的 client-side rendering(CSR),這種做法對 SEO 並不友善。後來我才改成使用 Next.js 的 server-side rendering(SSR)架構,Google 才能正確 index 網站內容。
這段經驗讓我意識到,如果能一開始就釐清網站的目標特性(例如是否需要 SEO、是否要支援快速載入),其實可以大幅降低修改成本,第一版也能做得更精準。
同時我也體會到,在 AI 能產出程式碼的情境下,「人類的角色更像是 PM」,負責定義清楚的產品需求。
2. 讓 ChatGPT 幫你整理成一份完整 PRD
Vibe Coding 本質上是「對 AI 下指令」,但要寫出有效的 prompt 並不容易。我一開始的指令常常寫得不夠完整,導致結果不盡人意。
後來我調整方式:先把想要的幾個核心功能列出來,再請 ChatGPT 幫我整理成一份比較完整、結構清楚的 PRD。這份文件我再貼到 Cursor 裡,讓 AI 根據這個 PRD 寫出一整段功能。
我實測下來,Cursor 在接收到結構清楚的 PRD 時,產出的品質跟邏輯完整性都明顯更好。 這種流程也能減少我反覆修 prompt 的時間,讓整體開發體驗更順暢。
3. 用 Git 做版本控制,需要的時候直接打掉重練
Vibe Coding 對從零開始開發來說非常快速,但當你已經完成一個基本版本、準備進入優化階段時,就會發現新的挑戰:改一段 A 功能,可能會不小心弄壞另一段 B 功能。
這時候我發現,與其不斷請 AI 修 patch,不如用 Git 做好版本控制,保留明確的每一步變更紀錄。有需要時可以直接回到上一個穩定版本,會更有效率、也比較不會留下難以追蹤的技術債。
上面講了那麼多流程優化,但實作過程中,我也不斷思考一個問題:既然 AI 可以寫 code,那人類還需要做什麼?
這次的開發經驗給了我一個很明確的答案:能夠判斷程式碼品質,是做出可維護產品的關鍵能力。
像是我就觀察到,AI 在生成程式時常常把所有邏輯塞進同一個檔案,完全沒有模組劃分。對於一次性的 demo 或練習來說沒什麼問題,但若希望這個工具能長期使用並持續迭代,這種寫法很快就會變成地雷。
這種時候就需要人類介入,手動拆分檔案、釐清模組邊界、設計合理的資料與邏輯架構。否則就算 AI 能寫出一堆 code,也很難維護、debug、更別說重複使用。
架構越清楚,AI 回答越精準,效率也越高
除了可讀性與維護性,良好的程式架構還有一個好處:可以幫助 AI 更有效地回應你的問題。
如果整個程式混在一個檔案裡,即便字數沒有超過 AI 可接受的 context window,但因為有很多多餘資訊,導致 AI 更容易誤判或回傳不相關的結果。
相反地,當 codebase 結構清楚、有良好命名與模組區分時,你可以很自然地下 prompt:
「請修改
calculateStats.js
裡的檢定邏輯,改成用 z-test 判斷比例差異。」
這樣 AI 回答的正確率與效率就會大幅提升,也更能發揮「AI 寫 code、人類決策」的優勢。
結語:Vibe Coding 是一個提升生活實作力的好工具
如果你也是一個常常腦中冒出點子、卻不知道怎麼實作的人,我真的很推薦試試這種方式。即使不是工程師,只要願意摸一下 Git 和 VS Code,很多想法都能變成產品雛形。
最後也歡迎你在留言區分享你用 Vibe Coding 做出的酷東西,或是你遇到的挑戰與心得。這是我最近正在探索的實驗方式,也期待能從你們的分享中獲得更多靈感 🙌
如果對於我的其他文章有興趣,歡迎前往 Data Analyst 的學習筆記 觀看更多文章~也歡迎在留言區跟我分享你的心得!
文章推薦: