KeyFrame

不會寫程式也能做產品?AI Coding新手雷區與重要學習方式 ft. AI Coding 資深教練 Kai Yen

Be Smarter 下班聊個天·6月19日週五·27 min中文

三句話摘要

軟體工程師 Kai 分享如何用「積木架構法」學 AI Coding,並點出初學者在 Vibe Coding 中最容易踩到的安全地雷。 Vibe Coding 讓人人都能快速產出,但唯有理解前後端架構、保護好 API 金鑰,並學會清楚定義問題的輸入與輸出,才能從「做出東西」真正進化到「做對東西」。 Vibe Coding 讓人能快速產出,但不理解底層架構會留下致命缺口。 許多人用 AI 工具建了看起來能用的東西,卻不知道資料沒有真正被儲存,或金鑰暴露在前端,形成假完成的假象。

重點整理

重點
  • 1

    Vibe Coding 讓人能快速產出,但不理解底層架構會留下致命缺口。 許多人用 AI 工具建了看起來能用的東西,卻不知道資料沒有真正被儲存,或金鑰暴露在前端,形成假完成的假象。

  • 2

    前後端分離是安全的核心原則。 前端的任何東西都可以被用戶取得,因此 API 金鑰、環境變數等敏感資訊絕對不能放在前端,必須由後端在受控權限下管理。

  • 3

    積木架構法的精髓是「定義清楚每個積木的輸入與輸出」。 即使不懂 AI 中間的運作細節,只要能清楚定義每段程式的 input/output,就能正確組裝整個系統。

  • 4

    AI 時代,「會定義問題的人」比「會寫程式的人」更有優勢。 AI 就像一個很會寫程式的工程師,但若你沒有給出清楚的邊界與藍圖,它就會亂衝;能精準定義問題的人才是真正的指揮者。

實用技巧與重點

乾貨
  • 一位朋友因將 OpenAI API key 放在前端,隔天早上帳單超過 NT$100,000
  • 早期接案故事:NT$50,000 案子,中間人抽 NT$10,000,兩人平分後各得 NT$20,000,最終花了 8 個月完成,時薪約 NT$6
  • API 計費方式:月訂閱制 vs. 按使用量計費(每次呼叫可能 NT$1 或 NT$0.5)
  • 工具分類:AI 工具(Gemini、ChatGPT)vs. AI Coding 工具(有介面 vs. 終端機操作)
  • 建議 AI 工具訂閱採月付制,避免年付以便隨時切換
  • 90% 的傳統軟體工程技能可能消失,剩下 10% 將被放大 100 倍
  • 積木架構法涵蓋的核心模組:登入系統、資料庫、爬蟲模組、AI 互動模組、API 串接
  • 常見資料來源三類:付費 API、免費 API、無 API(需直接爬前端頁面)
  • 重點安全警告:不可隨意串接金流(無限迴圈可能持續扣款)、環境變數不可暴露前端
  • 工具提及:Claude Code、n8n、LINE Bot API、OpenAI API、AFTEE(日本先買後付服務)
  • 社交工程案例:假面試讓求職者執行 `npm install`,藉此入侵電腦並竊取 Chrome 中的憑證

結論

結論

Vibe Coding 讓人人都能快速產出,但唯有理解前後端架構、保護好 API 金鑰,並學會清楚定義問題的輸入與輸出,才能從「做出東西」真正進化到「做對東西」。

完整解析

詳細

這支影片是「下班聊」Podcast 對 AI Coding 講師 Kai 的訪談。Kai 擁有成功大學光電系與台大農業機電所的學歷,並有十年軟體工程師資歷,曾在台大、女人迷、國泰金控的黑客松獲獎,也經歷過創業失敗後重返工程師之路。他的學習哲學源自早期慘痛的自學經驗——花八個月完成一個接案專案,時薪只剩 NT$6,這段經歷逼使他思考如何「快速開發」,最終發展出以積木為核心的學習方法論。

Kai 指出,學程式不應該像背英文文法那樣死背語法,而應先掌握核心語法約十五個,其餘靠 Google、套件與函式組裝——就像先學基礎單字再透過真實對話進步。進入 AI Coding 時代,這個邏輯不變,只是積木的粒度變大了:過去一個積木可能是一條語法,現在一個積木可以是整個功能模組,例如登入系統、資料庫、AI 互動介面或 LINE Bot 串接。

訪談中特別深入討論了 Vibe Coding 的問題。許多初學者用前端工具快速建出「看起來能用」的介面,卻完全不知道資料沒有被儲存、沒有後端伺服器。Kai 用一個朋友做物流 CRM 的案例點出問題:整個系統只是前端頁面,重新整理後資料就消失了。他強調,Vibe Coding 給了你一個超能力,但你還是要理解這個超能力在做什麼,否則只是做出一個「半成品」。安全性是另一大核心議題:前端的所有內容都可以被用戶存取,API 金鑰一旦放在前端就等於公開,某位朋友因此在一夜之間收到超過十萬元的 OpenAI 帳單。Kai 建議初學者自己玩 Vibe Coding 沒問題,但金流串接與環境變數這兩件事一定要特別謹慎,也可以直接將架構設計貼給 Claude Code,請它判斷安全性是否足夠。

最後,Kai 談到 AI 時代的核心競爭力不在於是否會寫程式,而在於能否清楚定義問題。AI 就像一個執行力強但沒有方向感的工程師,你若能明確說出每個功能的輸入與輸出、畫出完整的系統藍圖,AI 就能照著建造。他認為這對非工程背景的人反而是優勢:擁有領域知識的人,往往比工程師更清楚某個行業的痛點在哪,更能指揮 AI 建出工程師想不到的應用——例如藥師用 LINE Bot 幫長輩解釋處方藥、或自動化股市資訊彙整等高度重複性的工作場景。

關鍵時刻

Pipeline v2

帶時間戳的重點,會在逐字稿層級分析上線後產生。目前請先透過原始影片觀看。

事實查核

Pipeline v2

說法查證是下一次管線升級的一部分。KeyFrame 只會顯示它真正能驗證的內容。

更多「AI 技術」的內容

Claude Cowork vs Codex: 誰才是更好的AI工作助手?
16 min
AI 技術中文6月20日

Claude Cowork vs Codex: 誰才是更好的AI工作助手?

李厂长来了

  • 介面設計哲學不同:Codework 以標籤頁區分聊天、文書與程式碼三種模式,任務彼此隔離不混淆;Codex 則將所有功能整合在單一介面,減少切換成本,但頁面相對雜亂。
  • 第三方整合能力差距明顯:Codework 提供大量連接器並支援 Zapier 擴展,且可針對每個連接器精細設定讀寫權限(如 Gmail 只讀免確認、寫信需批准);Codex 的插件數量較少且缺乏同等級的權限控制機制。
  • 定時任務管理方式影響長期使用體驗:Codework 將同一自動化任務的歷史記錄歸類在同一條目下,便於追蹤;Codex 每次執行都獨立列出,隨任務增多左側欄會越來越臃腫,不利於長期管理。
我贏得 NVIDIA GTC Taipei 2026 的金票啦!這 4 天展期會有什麼不一樣的體驗呢? | Computex 2026
編輯精選
28 min
AI 技術中文6月20日

我贏得 NVIDIA GTC Taipei 2026 的金票啦!這 4 天展期會有什麼不一樣的體驗呢? | Computex 2026

EngineerGary

  • Tokenomics 重新定義 AI 工廠價值:黃仁勛將所有輸出重新框架為 Token = Revenue,傳統工廠生產實體商品,AI 工廠改為生產 Token;對製造端而言,目標是以最低成本產生最多 Token,實現每投入 1 元帶回 3–5 元回報的商業邏輯。
  • 開源策略是市場放大器而非讓利:NVIDIA 釋出 Cosmos 3、Apomile 3 等開源模型,以及通用人型機器人,目的是降低新創進入自動駕駛、World Model、Physical AI 的門檻,擴大整體生態系規模,最終帶動更多算力與服務需求(「The more you buy, the more you earn」)。
  • Deal to Delivery Agent 解決中小企業流程瓶頸:Gary 團隊識別出企業收到客戶需求後,需跨工具手動完成報價、開票、GitHub issue、通知等重複性操作是最大效率殺手;Agent 自動拆解商機、建立 ERP 記錄並推送 Telegram 通知,人類只需在 Draft 狀態下做最終 Review 確認。
黃仁勳親自欽點⁉️執笠手機公司 BlackBerry 變身 AI 機械人主系統🤖下一個大浪提前準備
編輯精選
30 min
AI 技術中文6月20日

黃仁勳親自欽點⁉️執笠手機公司 BlackBerry 變身 AI 機械人主系統🤖下一個大浪提前準備

Coco哥

  • QNX 擁有機器人 OS 三大不可替代技術門檻
  • Windows 響應延遲 200 毫秒,Linux 一旦核心崩潰全部失效,而 QNX 具備毫秒級即時決策、ISO 26262 ASIL-D 與 IEC 61508 SIL-3 最高安全認證,以及微型內核獨立架構(單一模組崩潰不影響其餘系統),三項條件同時達標,現階段競爭對手均未能複製。
  • 40 年護城河非短期可追趕