撰文 李岱君

不懂程式也能開發 App!Vibe Coding 是什麼?怎麼做?


從基礎程式語言一竅不通的麻瓜,到能開發一個屬於自己的 App、網頁,你覺得需要多少時間?雖然開發時間取決於項目難度,但有人僅花了 10 分鐘就製作出類似 Airbnb 的網站,也有人從無到有寫出了 App 上架,這些背後的方法,都指向近來的熱門話題「Vibe Coding」。
Vibe Coding 是什麼?告訴 AI 你要做什麼,而不是怎麼做
Vibe Coding(氛圍程式設計)是一種軟體開發方法,開發者只需用自然語言告訴 AI 想要什麼,然後讓 AI 寫程式,不需要理解程式如何運作,例如當你想要可以追蹤工作時間的 App,直接將想法與 AI 溝通,就能請 AI 寫出來。
隨著大型語言模型迭代,AI 寫程式的能力將過往的技術門檻逐漸弭平,讓人人都更有機會構建出想要的軟體。Vibe Coding 一詞是 OpenAI 前共同創辦人安德烈·卡帕斯(Andrej Karpathy)提出的概念,他指出 Vibe Coding 就是「完全順應氛圍(vibes)、忘記程式碼的存在」。這種開發方式的重點擺在「氛圍」,像是和設計師溝通想法一樣。
Vibe Coding 的概念一出現,隨即在科技圈引起熱議,更吸引非技術背景的人紛紛投入開發程式。其實過去就有 low code、no code 等概念,意思是借助工具,讓「寫程式」這項必要條件變得更簡單,讓人更專注於創意。Vibe Coding 就是延伸此概念,落實「AI 民主化」,賦能所有人。
具體而言,傳統的產品開發方式是「 寫程式 → 獲取建議 → 調整 」;Vibe Coding 則是「 描述需求 → 評估結果 → 提供回饋 」。
Vibe Coding 的 5 大優勢
1.縮短開發時間: 原本需要數周的開發任務,可縮短至數天甚至數小時。
2.大幅降低技術門檻: 用戶不再需要花費數年學習程式語言,只需清晰表達需求,AI 就能透過技術實現。
3.資源最佳化與成本降低: Vibe Coding 能提升工作效率,使團隊能夠更快地進行更多測試,加速學習迭代。
4.專注於創意: 使用者普遍提到,Vibe Coding 讓他們不再受限於技術瓶頸,能更專注於產品的創意和用戶體驗,從而提高產品品質。
5.快速驗證商業概念: 在過去,特定垂直領域的軟體常被認為市場太小而不值得開發,但現在開發的金錢與時間成本降低,可以快速驗證產品雛型。
Vibe Coding 最適合哪些人使用?
Vibe Coding 能釋放創意、簡化開發流程、降低門檻,適合那些過去因技術門檻而難以參與數位產品開發的人。尤其推薦以下 4 種人使用,主要因為這些人往往面臨資源限制、時間壓力或專業技能缺口等挑戰:
1.非技術背景的創業者與企業家
這些人如果不需要高度依賴技術合作夥伴或外包開發團隊,就能直接將想法轉化為產品原型,不僅可以節省大量資金,還可以縮短產品上市時間。
2.企業內部的管理者
企業內的行銷、業務或客服等非 IT 部門,如今可以自行開發網頁和活動頁面,不再需要等待 IT 部門的支援,能更靈活地應對市場變化。
3.自由工作者
設計師、內容創作者和顧問等職業,不再受限於單一專業領域,現在能夠提供從概念到實現的全套服務。這使他們能夠開發更多樣化的產品,增加收入來源。
4.企業內部的創新團隊
企業內部創新團隊可以快速測試新想法,不必等待冗長的資源分配過程。如此一來能加速創新周期,使團隊能夠在較短時間內評估更多概念的可行性。
Vibe Coding 適合拿來做什麼?
項目 | 快速原型開發 | 內部工具開發 | 簡單網站和應用 |
---|---|---|---|
適合用途 | 驗證商業概念的初始版本 | 自動化工作流程和數據處理 | 具有基本功能的網站和 App |
不適合的場景 | 高安全要求的系統(如金融交易核心或醫療系統) | 需要精密計算的密集型應用 | 需要與多個系統深度整合的複雜項目 |
5 步驟入門,你也能 Vibe Coding
Vibe Coding 最吸引人的,就是即便完全沒有程式設計背景,也能從零打造你的應用程式。
步驟 1:選擇合適的工具
- Cursor Composer:程式設計平台,整合 AI 功能,支援多種程式語言。
- GitHub Copilot:微軟和 OpenAI 合作開發的 AI 助手,可與 Visual Studio Code 等主流編輯器整合。
- ChatGPT Plus:可用於生成完整程式碼方案,適合沒有專業開發環境的初學者。
- Replit GhostWriter:線上開發環境結合 AI 輔助,適合網頁應用開發。
- Lovable:專注於應用開發的低門檻 AI 工具,對完全沒有技術背景的用戶友善。
初學者建議從 ChatGPT Plus 開始,因為介面簡單直接;有一定技術背景的用戶可以嘗試 Cursor Composer 或 Replit,會提供更完整的開發環境。
步驟 2:提出明確需求
描述最終目標 :例如「我需要一個可以追蹤每日支出的軟體」或「我想要一個能分析 CSV 銷售數據的工具」。
列出核心功能 :明確指出軟體需要具備的主要功能,例如:
a.用戶可以新增支出項目
b.每個項目包含金額、日期和類別
c.系統自動生成月度報表
d.支援按類別篩選支出確定技術範圍 :說明現有的技術環境限制,例如「必須在網頁瀏覽器中運行」或「需要能在手機上使用」。
Prompt 技巧: 使用結構化的描述,而非籠統的需求。與其說「我想要一個記帳軟體」,不如說「我需要一個線上工具,讓用戶輸入每日支出,包含金額、類別和日期,並生成月度統計圖表」。
步驟 3:與 AI 互動,生成初始版本
評估 :
AI 會生成一個解決方案草稿,這時需要:
a.閱讀 AI 的解釋,了解基本架構
b.確認所有要求的功能是否都被囊括在內
c.查看是否有任何你沒考慮到,但 AI 建議的功能提供回饋 :
透過對話給予 AI 回饋,例如:
「用戶界面太複雜,能否簡化?」
「我希望支出類別是預設的,不是用戶自定義的。」
「能否增加數據匯出功能?」使用技巧: 在這個階段,不要一次要求太多改動。專注於一兩個最重要的調整,然後逐步完善。
步驟 4:持續迭代開發
分階段測試 :對於較複雜的功能,要求 AI 提供可以立即測試的中間版本。例如:「請先生成一個只有增加支出功能的版本,我們測試後再增加報表功能。」
具體描述問題 :遇到問題時,提供明確的錯誤描述。例如:「當我點擊保存按鈕時,數據沒有被記錄下來。」
建立在成功的基礎上 :當某個功能正常工作時,先向 AI 確認這一點,並繼續下一步。例如:「登錄功能正常運作了,現在我們來測試數據同步功能。」
使用技巧: 在每次重大變更後,要求 AI 提供完整的更新版本,而不是只修改一小部分。這有助於保持程式碼的一致性。
步驟 5:上線與使用
當產品基本成形後,可以嘗試落地:
- 上線選項: 可根據產品類型,請 AI 建議適合的部署方式:
a.網站:使用 GitHub Pages、Netlify、Vercel 等免費服務部署。
b.行動應用程式:使用 Expo 或類似工具打包為應用程式。
c.桌面軟體:使用 Electron 打包為桌面軟體。
上線指南: 讓 AI 生成詳細的步驟說明。例如:「請提供將這個網站上線到 Netlify 的具體步驟。」
後續維護: 請 AI 提供一份簡要的文件,說明該產品的核心功能和基本結構,以便之後進行修改或擴充。
實用技巧
- 分解複雜任務: 大型專案應分解為多個小模組逐步實現,每個模組專注於一個核心功能。
使用參考範例:向 AI 描述類似於目標的現有產品,例如「類似 Evernote(筆記軟體) 但專注於財務紀錄」。
保持對話連貫性: 在同一對話中完成一個應用的開發,避免重新開始新對話。
學習基本概念 :花些時間了解網頁、API 或數據庫等基本概念,這將大大提升您與 AI 的溝通效率。
隱私注意事項: 不要在與 AI 的對話中分享敏感資訊或私密數據,如 API 或帳戶密碼。
保存所有與 AI 的對話記錄: 發生問題時較容易回溯。
資料來源:BI、AOL、CNBC、Bloomberg、WSJ、Zapier、ZdNet、Forbes
核稿編輯:王宥筑