AI coding 怎麼開始?不需要會寫程式就能寫 code?Vibe Coding 的第一步

目錄

how-to-start-vibe-coding

Vibe Coding 是什麼?

Coding 在以前聽起來是一個很艱辛的開發過程,Vibe Coding 則是相反過來,形容只要透過 AI 的協助,就可以像聊天一樣,讓 AI 去寫程式碼,很輕鬆的開發出產品。隨著各種 AI 工具的進步,現在不只不用會寫程式,甚至可以完全不看程式碼,直接根據結果來回修正,完全可以跟著 vibe 讓想法輕鬆落地!

但在那之前,你可能還是會擔心,中途會不會遇到哪些困難…

困難一:看不懂程式語言,要怎麼請 AI 寫程式?

身為一個非程式語言背景的人,一開始聽到 AI Coding 最大的疑問就是,看不懂程式語言,怎麼知道 AI 給的東西是對的還是錯的?

但隨著 AI 工具的進步,這個問題很快就得到答案了,現在 ChatGPT、Claude 都有「Canva」的功能,可以直接預覽程式碼,讓你直接看到程式碼跑出來的結果。這也讓「看不懂程式碼」變得不重要了,就像專案經理是請工程師根據需求寫程式碼來開發,現在,你就是專案經理,只要能夠說清楚需求,就可以請 AI 這位工程師來幫你寫程式,最後由你根據預覽的成果,給 AI 調整回饋、調整程式碼。

AI 寫程式推廣大使 Mosky 說過,中文將透過 AI 成為最強的程式語言!

有些功能 AI 還不能幫你一步到位的產出程式碼,但也許過幾個月之後,AI 就能做到現在做不到的事了!所以無論會不會寫程式,最重要的精進方向都是「怎麼清楚描述需求」,而非「怎麼看懂程式語言」。

prompt 小技巧:請你用白話文解釋每段 code 的用途

困難二:不懂怎麼拆解任務

想一步到位,AI 可以在收到一個模糊需求之後,腦補很多功能幫你完成一個網站,但過程中可能擅自新增了很多你不需要的功能和不想要的設計,這就是因為需求還不夠清楚。

prompt 小技巧:先不要急著寫程式,請你重新描述你目前的理解,並問我幾個問題深入釐清需求

當你越來越常提需求給 AI,就可以累積一些常用需求或 prompt(例如:網頁需不需要 RWD、網頁要用什麼風格…),也會知道需求到底需要細緻到什麼程度,以及怎麼在過程中跟 AI 討論之後,回頭調整需求。

困難三:不知道怎麼處理錯誤訊息

既然是用 AI 產的程式碼,當然是丟回去叫 AI 改!

這裡需要做的唯一一件事情,就是截圖或複製跳出的錯誤訊息,貼回去給 AI,然後跟他說「這裡出錯了,請幫我修正」。

一開始我會想說要自己看懂那些錯誤訊息,再去告訴 AI,但我發現這是多此一舉,因為 AI 比我更懂,我根本看不懂!而且真的要修正錯誤,也不是我去修改程式碼,是 AI 去改,所以就全部放心交給他!我要做的事就是執行程式碼、遇到錯誤問 AI、拿修改過後的程式碼再跑一次看看,重複這個循環,直到成功!

但當你總算戰勝心魔,開始請 AI 幫你寫 Code 產生酷酷工具的時候,接著就會冒出更多更多疑問…

有 AI 就完全不用學程式語言嗎?

基礎|基本要知道的技術概念有哪些?

雖然說 AI 懂的一定比我多,但我發現如果可以把一些基本概念釐清,在描述需求的時候也可以更明確,讓 AI 在你需要的範圍內生成程式碼,也會減少一些 AI 腦補過多功能的狀況。

  1. 前端、後端、資料庫:並不是所有需求都需要這三個全部都有,如果只需要前端,就可以在提出需求的時候明確說明給 AI。
    • 前端:看得到的畫面,例如網頁、按鈕、文字,都屬於前端,讓人可以跟網頁互動
    • 後端:看不到的應用程式,像是網頁背後的處理系統,例如點擊「送出」之後要做什麼事
    • 資料庫:就跟名稱一樣,是負責「記東西」的地方,讓這些資料下次可以再拿來用
  2. Webhook:可以讓不同平台互相接收到即時通知的管道,像應用程式之間的門鈴,例如有人在 Google 問卷填寫表單,可以透過 webhook 到 Notion 新增一筆資料
  3. API:程式語言之間溝通的語言跟規則,可以透過 API 請另一個程式去做一件事,遠端操控其他工具的服務或取得別人的資料,例如可以透過 OpenAI API,讓你即使不在 ChatGPT 上問問題,也能使用 ChatGPT 背後的模型來建置聊天機器人

這裡附上我平常判斷需要什麼功能的邏輯(這張圖是 AI 生成的,如果有誤,請工程師大大們不吝賜教!!

Technical Decision
複雜度:
🟢 最簡單 – 像做 PPT
🟡 簡單 – 像做會動的 PPT
🟠 中等 – 像做 Excel 資料管理
🔴 複雜 – 像做小型網站
🔴🔴 很複雜 – 像做 APP

延伸推薦:流程圖繪製工具 Mermaid
補充:只要跟 AI 說「幫我用 Mermaid 格式產生流程圖」,再把程式碼貼上 Mermaid 編輯區,就可以產生這樣的圖了!

進階|AI coding 成果可以變成網站嗎?

你還缺一個「雲端部署」的步驟,也就是要讓程式碼從「只能在電腦上運行」變成「可以線上運行」!

在這裡推薦一個雲端部署工具 Zeabur,很多技術的東西都可以透過幾個按鈕點完之後,就自動生成一個網址,讓原本的 HTML 直接變成可以分享給別人的網站!至於那些按鈕是什麼意思,我到現在也沒完全理解XD

更讚的是 Zeabur 的創辦人沅霖會在 threads、Instagram、Facebook 各大平台出沒,即時幫大家解惑,小白真的可以輕鬆上手!

適合寫程式的 AI 工具

對於已經會程式語言的人來說,GitHub Copilot 是個很讚的工具,但我光是進到頁面的第一瞬間就愣住了,不知道怎麼往下,所以這邊列出的工具,真的真的是你不用會程式語言都能使用的工具!

不會程式語言,也能輕鬆產出程式碼的 AI 工具

  • ChatGPT
    • 優點:會延伸問你一些問題,推測你的下一步
    • 缺點:設計品味不是很好
  • Claude
    • 優點:產程式碼的速度很快、在沒有明確需求的時候,設計品味比 ChatGPT 好
    • 缺點:產程式碼常常跳出字數達上限的訊息,就要另開一個新的對話
  • Cursor(本機應用程式)|工程師推薦
  • Windsurf(本機應用程式)|工程師推薦
  • Lovable
  • Canva|優點:設計很好看

但新工具一直推出,要怎麼追得完?

心法分享|先搞清楚希望 AI 完成什麼事

AI 可以很快速的完成需求,所以最重要的問題就變成,不是做不做得到,而是到底需要做什麼?要透過 AI 寫程式完成什麼?

我認為從自己的需求出發,才是最核心、最能持續有動力去動手 Vibe Coding 的方向。要記得,目標不是「學習程式語言」,而是要做出一個有用的東西。

The best ideas come from solving your own problems.
James Dyson

只要抱著迭代思維和勇於嘗試的精神,一定會越來越有心得,也會更快從中獲得成就感!

以我自己應用 AI 的經驗,我認為這就是一個「在過程中不斷釐清最核心的問題是什麼、不斷確認成果能不能解決最核心問題」的過程。到頭來,重點真的不是工具,而是能不能把需求溝通清楚,這才是 AI 寫程式的過程中,最需要的能力之一。

因為 AI Agent 會比人類還要會用工具,所以人類要做好一個甲方,也就是要懂的怎麼「驗收」跟「招標」。

總結:到底需不需要學程式語言,再來 Vibe Coding?

我認為「透過 AI Coding 打造工具」跟「學習程式語言」其實是互補的:AI 高效率的提供程式碼,而程式語言則是理解與修改的基礎,能讓你在開發上擁有更高的主導權。實際上,Vibe Coding 的的確確大幅降低了寫程式的門檻,也許你現在還不會,但不代表你永遠不需要學會程式語言。當你想要或需要去開發技術難度更高的產品時,勢必會需要應用到難度更高的技術。

然而,我也很認同 Manny 在曼報 podcast EP100 提到的,有需要,就會去學了,不用先煩惱那麼多!當學習程式語言變成解決問題中很重要的環節時,真的需要的話,就算沒人逼你,你也會想辦法去學會的。至於現在需不需要去學,依個人需求和興趣決定就好了,不 FOMO、回歸自身需求才是最實際的!

也許在未來人人都需要懂一點程式語言,幸運的是有 AI 的輔助,學習程式語言這件事已經變得更快、更輕鬆、更有趣(而且問 AI 完全不用擔心自己問的問題是笨問題…),甚至可以讓你在很一開始的時候就得到滿滿的成就感!如果你也跟我一樣,一直都想學,但不知道怎麼開始,現在真的就是最好的時機!

現在這個能靠 AI 寫 code 的時代,AI 正在放大每個人的創造力:設計師可以成為前端工程師、前端工程師可以成為全端工程師、全端工程師可以成為更好的技術 PM,業務、行銷人也可以自己設計自動化流程,每個人都有能力動手做出自己的產品。而對工程師而言,有更大的優勢可以在「想法」上付出更多心力,去發揮創意實現獨特的產品構想!比「寫程式碼」更有價值的,正是人的創意、判斷力與問題意識。

雖然在 AI 剛出現的時候,不只工程師,各種職能的人都會擔心是不是有一天自己就要被取代了,但真的開始學、開始用之後,就發現自己其實是多了更多工具去做本來不會的事。只有把思考的工作都丟給 AI 的人,才真的有被取代的風險!我相信只要有意識的不要「把大腦外包給 AI」,人的想法和思考都還是很有價值,而且暫時不會被 AI 取代的!

就算你現在沒有想要學程式語言,也很推薦多去看看別人的應用案例分享,你一定也可以從工作或生活中找痛點,開始建立自己的解決方案!

Takeaways

  1. Mosky:「中文就是最強的程式語言!」最重要的是學習如何把需求清楚說明給 AI
  2. 先硬用,從試錯中學習,才越來越知道怎麼應用
  3. 從自身需求出發,快速獲得小成功,就能逐漸掌握 AI 寫程式的技巧

延伸推薦:2025 Generative AI 年會 回放影片

Bad things can happen fast, but almost all good things happen slowly.

任何值得做的事情,都值得慢慢去做

No choice is inherently the best. What makes something the best choice? You. You make it the best through your commitment to it. Your dedication and actions make any choice great. 沒有什麼選擇是最好的。只要你投入,那個選擇就會變成最好的選擇。你的付出就是你對選擇的承諾,而承諾和你的行動,就是讓任何選擇都變成最佳選擇的關鍵。

What would it look like if it were fun?

返回頂端