參加Claude Code(CC)訓練營主要是對AI如何協助寫程式這個主題有興趣,也看到很多臉書文章說Claude Code是vibe coding相當強的工具,並在之前有參加Luka的說明會,很好奇如何用AI完成在說明會展示的那幾個專案,所以就加入了。實際接觸Vibe Coding發現雖然只要給出模糊的概念,Claude Code就能幫你寫出程式,但只要想得不夠周全就下指令,會需要不停地測試與溝通才能逐漸接近自己想要的成果。如果一開始有先規劃清楚才請Claude Code寫的話,將可以省下後續許多試錯的時間。
很感謝講師Luka在CC訓練營中設計的這幾個專案作業,透過這幾專案的實作,才了解AI寫程式可以應用在許多不同的面向。也謝謝有平台及安排額外的線上會議時間讓訓練營同學分享他們各自做的專案作業。聽了他們的想法和運用才驚覺原來還可以要Claude Code解決某些經常會使用到的功能。
訓練營中的每個專案作業是從簡單到慢慢增加難度,每一個作業試著把它完成可以讓你獲得更多與AI協作寫程式的經驗。以下簡單描述我在每個作業所學習到:
觸類旁通:
第一個作業是寫網頁小程式,但沒有限定你要寫什麼。當時想到發訊息經常有縮短網址的需求,乾脆要Claude Code寫一個可以產生短網址和QR code的網頁,沒想到第一版寫出來的程式是不能連網的假的短網址。我向它抱怨不能連後,接著讓我驚奇的事發生了,它主動調用短網址老牌網站的API,寫出可用的短網址網頁。

短網址網頁
由於第一個作業不限主題,聽到有同學是寫可批次縮小照片尺寸的網頁,這個Idea太棒,我後來也請Claude Code幫我寫出來了。

縮小照片網頁
明白限制
第二個作業是寫Chrome擴充套件,是要做網頁的吸色工具,做了才知道原來有些網頁的設計是無法偵測到顏色,後來陸續提出要求及測試後,大部分的網頁都可辨認出色碼。也學習到如何將寫出程式設成Chrome套件。
簡化功能
第三個作業是寫訂飲料系統的GAS程式。原本我的野心太大,想要做任何飲料Menu的圖片上傳都可以產生相應的訂飲料介面,Claude Code還幫我分別寫了使用者訂飲料的前端和可上傳Menu的後台管理系統,但因為需要使用圖像辨識API,當時沒先把整個系統邏輯弄清楚,一直沒有成功。後來果斷放棄,改成在Claude Code上傳Menu圖票產生訂飲料畫面就成功了。

訂飲料網頁
佈署調校
第四個作業是要把Line神隊友,在Line打訊息、留言,可轉文字存到Google Sheet。這個作業比較複雜,並且需要佈署到Zeabur上。佈署上去後一開始一直沒辦法執行成功,當貼Log的Error訊息給Claude Code反覆確認後,發現到是Port設定的問題,並搭配研究助教的教學影片後,終於完成這個作業。如今,我的Line神隊友,除發訊可轉存外,語音留言或傳圖都可以轉文字在Google Sheet留下紀錄。
建立系統
第五個作業是建立網站,Claude Code很快幫我寫出可以佈署在GitHub的簡單部落格網站。當時心想,何不也請他寫一個CMS(上傳文章的內容管理系統),發文可以設標籤並且可用MarkDown語法轉Html,結果它真的也做出來了。

部落格發文的CMS
有效回溯
第六個作業是寫爬蟲程式,我原本只要Claude Code爬股價畫趨勢圖,它很快就自己調用股市API和Python爬蟲套件做出來了,但當我要它繼續畫出K線圖時,開始網頁無法正常呈現,嘗試很多可能性都無法成功。這時我和它說,你在畫K線圖前是正常,它同意也回溯到沒有K線圖功能的狀態。可能話K線圖需要先把資料寫到資料庫,但當時沒有請它往那個方向思考。
專案拆解
第七個作業是想一個複雜專案,然後規劃Vibe Coding工作流,謝謝講師Luka逐一針對每個同學提出的專案想法來拆解分析如何完成。也讓自己思考未來開發程式專案可以如何好好去規劃自己的工作流。
結語:
這是一堂很硬的課程,如果有好好完成每個作業的話,所有的試誤都會為你帶來寶貴的Vibe Coding經驗。參加這個訓練營也學習到複雜的程式專案可以先問Claude AI 如何寫 Prompt給Claude Code寫程式。後續Luka如果有再開新的新的一梯CC訓練營,非常鼓勵大家參加,除了學到與AI協作寫程式外,講師、助教和同學都會給你很棒的回饋,更可以透過AI 來幫你寫出提升生活與工作效率的小工具。
最後,針對Vibe Coding, 我請ChatGPT寫了一首Suno的AI寫程式讚歌,對這次Vibe Coding另外留下特別的紀錄。
https://suno.com/s/OizHZucx8Jtm52mf