不會寫程式也能做產品？這篇幫你搞懂 Vibe Coding 是什麼、適合誰、能做到哪些事
你是不是也曾經有過這種想法：「要是有個小工具能幫我做這件事就好了。」
但又想到——我又不會寫程式，算了啦。
以前，這個念頭只能留在腦裡。現在，有了 AI，你可以用一句話，讓 AI 幫你把它做出來，這就是 Vibe Coding。
想像一下，你只要對 AI 說：「我想做一個展示我家狗寶貝成長的網頁」，它就會自動生出畫面與功能，甚至還能幫你加上時間軸與可愛的照片展示區！
身為一位曾從事開發、後來轉為產品經理，最近又靠 Vibe Coding 做出四個新作品，還維護了一套舊系統的使用者，我希望整理出：
- Vibe Coding 對初學者或進階者的幫助各是什麼？
- 哪些情況它非常有用？哪些情況它會出現限制？
- 可以怎麼開始？需要學什麼？
1. Vibe Coding 是什麼？為什麼值得關注？
Vibe Coding 指的是「用自然語言請 AI 幫你寫出能跑的程式」，讓原本需要自己學寫程式才能做出來的東西，可以用說的、聊的方式完成。
對不同背景的人，它的用途與意義也不同：
- 對完全不會程式或是會一點點的初學者：它是快速進入技術世界、累積實作經驗的敲門磚，幫助你建立信心。
- 對進階者：它可以幫你把經驗延伸到新語言，或是跳過語法細節、迅速完成 MVP（最小可行產品）。
本篇將主要從初學者角度出發，帶你了解 Vibe Coding 的適用情境、如何開始、需要學習什麼，以及你能做到什麼程度。
2. 對入門者來說，應該怎麼開始？
很多人一開始對 Vibe Coding 有點興趣，但很快就會卡在一個點：
「我只是想試試能不能做出點東西，結果一查就要裝一堆環境、搞 server、資料庫、登入系統……是不是太複雜了？」
我的建議是這樣：從一個小網頁開始，原因有以下幾點：
- 幾乎什麼都不用安裝：只要把 ChatGPT 給你的程式碼貼進一個空白純文字檔案（Windows 用「筆記本」、Mac 用純文字模式的「文字編輯」），再把副檔名改成
.html，用瀏覽器打開就能看到成果，完全不需要安裝開發工具或自己架伺服器。 - 沒有帳號、資料庫、伺服器這些複雜設定：這些東西對一開始的你來說其實不是必要的，反而容易讓人卡住、失去動力。
- 每次修改、儲存、刷新，都能立刻看到變化：這個回饋在一開始非常重要，能幫助你建立成就感與動力。
很適合做各種個人小助手或有趣的小工具。除了開頭提到的狗狗成長日記，比如我放這個部落格的網站（louisan.dev），就是我用 Vibe Coding 快速搭出來的成果之一。
▲ 用 Vibe Coding 實做的部落格頁面
雖然簡單，但這類作品可以讓你用最小成本體驗「自己做出一個能用的東西」的成就感，而這通常就是能不能繼續學下去的關鍵。
不過也要提醒，這種做法也有它做不到的地方。例如：
- 你無法讓不同使用者之間互相看到對方的資料，因為資料只存在個人瀏覽器裡
- 你無法讓使用者登入、儲存到雲端、跨裝置同步
- 當資料多了或需要權限控管（例如：只有管理員能編輯）時，就會不夠用
所以這種方法比較適合做「自己用的小工具」，或當作原型，拿來說明你的想法或驗證流程。
3. 有必備的基礎知識嗎？
如果想用 AI 開始寫程式，要先學習什麼？這其實要看你現在的狀況。對於需要的基礎知識，我們又可以分成兩種情況來看：
✅ 完全沒程式背景
這類人一開始其實可以完全不學程式，只要會跟 GPT 聊天就能開始。但有一些前提要能接受：
- 畫面不完全照想像的走
- 每次叫 AI 改可能會壞掉一些舊有功能
- 當東西「不太能動」時不一定知道為什麼
那就可以直接用 ChatGPT 生成網頁程式碼，在 Chrome 等瀏覽器開起來跑就行了。
如果之後想要更穩定、好維護、能微調的作品，或發現越來越難請 AI 改出你要的成果，那就是進一步學習的好時機。
📘 初學者（會一點點，希望能控制得更多）
這時候建議掌握一些基礎知識，像是：
- HTML / CSS：知道畫面是由哪些元素構成，能自己調整樣式與結構
- JavaScript 基本互動邏輯：像是事件觸發、條件判斷、資料儲存（localStorage）
- API 概念：知道怎麼從外部取得資料（像是翻譯、天氣、AI 回應）
為什麼要學這些？
- 能更理解 AI 回給你的程式碼在做什麼
- 出錯時比較知道問題在哪裡
- 可以自己微調細節，比每次都請 AI 修改來得更快
總之，學得越多，當然能跟 AI 協作得更順利。但別讓「我還不懂」這個念頭卡住你——只要開始了，很快就會知道自己該補什麼。
4. 對初學者來說，Vibe Coding 的極限在哪？
Vibe Coding 雖然強大，但對於初學者來說，有一個很明顯的分水嶺：
- 一開始可能會驚訝於 AI 好像短短時間做了一整個功能
- 但做到某個程度後，會開始發現：「怎麼改一點功能就壞掉了？」「想加個登入，結果 AI 開始講一堆聽不懂的專有名詞？」
這些情況，就是初學者最常遇到的卡點。因為：
- Vibe Coding 不一定會幫你顧到程式的結構、維護性
- AI 幫你改 A 功能時，可能會順便弄壞 B 功能，因為它處理問題都比較片面
- 如果你不了解像伺服器這類更進一步的概念，就很難做到登入、同步、多使用者等更完整的應用情境。
這個階段就像攝影：
- 你可以用手機 + app 套濾鏡，快速做出不錯的照片，分享、收藏都沒問題
- 但如果你想控制光線、層次、細節，那就要學光圈與快門以及更多修圖概念了
Vibe Coding 也是一樣：
- 如果你只想做出一個能用的工具、驗證一個概念，它真的非常夠用了
- 但如果你開始對品質、細節、架構要求更高，就會發現真的還有很多要學的
所以這個「極限」不是 AI 不夠強，而是我們要不要再進一步深入學習。如果你願意深入，程式世界沒有極限；但如果你只想做到能用、能 demo，那你其實也可以在這裡停下來，沒有任何問題。
由於篇幅太長了我又想確保細節夠多，足夠有實用價值，所以這篇先整理到這裡，下一篇我會繼續介紹實用的 Prompt 指令與推薦工具。如果你現在腦中剛好有個小工具的點，不妨就用這篇說的方法，打開 ChatGPT，請它幫你試著做出第一個作品吧！