本堂主旨

學習三個概念,把 idea 真正落地

本學期教了很多東西,包括 Markdown、Agent 人格設定、Memory、Skills、Multi-agent、多模態。但這些技術要怎麼變成真正能用、可以分享給朋友的東西?答案是本堂課的三個基礎概念:

學期前面
學會「想做什麼」
不論是 SOUL.md、prompt 設計、agent 概念等,這些都是在「內容層」的能力
→
本堂課
學會「怎麼把它放到世界上」
例如 API、Git、部署等,這些是「傳遞層」的能力。兩者合起來,才能完成 vibe coding 的完整迴圈
PART 1

API:程式跟程式怎麼說話

0–30 min

API 這個詞常常聽到。我們從最基礎的「程式之間怎麼通訊」開始。

類比一:API 就是餐廳的點餐流程

餐廳場景
你 → 服務生 → 廚房
你看菜單點餐,服務生把點單送到廚房,廚房做完透過服務生送回給你。你不需要自己進廚房,也不需要懂怎麼炒菜。
≈
API 場景
你的程式 → API → Gemini 模型
你的 Python 把「請翻成日語」送到 Gemini 的 API,Gemini 跑完模型後把結果回傳。你不需要懂模型內部,也不用自己訓練。

實際看一次 HTTP 請求長什麼樣子

當你的程式呼叫 API 時,幕後其實是這樣的對話:

你的程式 → POST https://generativelanguage.googleapis.com/v1/...
Authorization: Bearer YOUR_API_KEY
Content-Type: application/json
{"contents": [{"parts": [{"text": "翻成日語:你好"}]}]}
Google 伺服器 ← 200 OK
{"candidates": [{"content": {"parts": [{"text": "こんにちは"}]}}]}

關鍵術語

術語意思餐廳類比
endpointAPI 的網址餐廳的地址
request你發出的請求點單
response伺服器回傳的結果菜送回來
API key身份憑證會員卡
JSON傳輸資料的格式菜單填寫格式

第一步:申請 Gemini API key

前往 Google AI Studio

瀏覽器打開 aistudio.google.com,用你的 Google 帳號登入。

左側選單點「Get API key」

進去後會看到目前的 API keys 列表(你還沒有,所以是空的)。

點「Create API key」

系統會問你要關聯到哪個 Google Cloud 專案。選擇 Create API key in new project 即可。

複製這串 key 到安全的地方

形如 AIzaSyB... 的長字串就是你的 API key。切記!不要分享給別人、不要貼到 GitHub、不要寫死在程式碼裡。

第二步:在 Colab 最簡單的 Python 呼叫

打開 colab.research.google.com,新建 notebook。左側 🔑 面板新增名為 GEMINI_API_KEY 的 secret,貼入剛才的 key,並開啟「Notebook access」。接著依序執行下面兩個 cell——「給 Gemini 一句中文,請它翻成日語」:

SHELL Cell 1 · 安裝套件(第一次才需要)
!pip install -q google-generativeai
PYTHON Cell 2 · 呼叫 Gemini
import google.generativeai as genai
from google.colab import userdata

# 從 Colab secret 讀取 API key(不要寫死在 cell 裡!)
genai.configure(api_key=userdata.get("GEMINI_API_KEY"))

# 選一個模型
model = genai.GenerativeModel("gemini-2.5-flash")

# 發送請求
response = model.generate_content("翻成日語:今天天氣真好")

# 印出回應
print(response.text)
OUTPUT Cell 2 執行結果
今日は本当に良い天気ですね。
  ↑ 你的 notebook 剛剛跨越了網路,呼叫了 Google 的 AI 模型!
檢核點 在 Colab 看到日語回應 → 恭喜,你已經完成了「程式跟雲端 AI 對話」的完整循環。後面所有的應用,都建立在這個小小的循環上。
API key 安全提醒 如果不小心把 key 推到 GitHub,惡意掃描程式幾分鐘內就可以把它撈走並濫用,算在你的帳單上。
PART 2

Git 與 GitHub:版本控制,從零開始

30–60 min

Git 是程式碼的「時光機」+「備份」。可以隨時回到過去的版本,也可以分享給別人。它是所有現代軟體開發的基礎,而且你不需要寫程式也能用(很多人甚至用 Git 管理 Word 文件、論文、筆記)。 安裝可參考:https://ithelp.ithome.com.tw/articles/10322227

類比:Git 是 Word 的「追蹤修訂」+「版本歷史」加強版

Word 場景
論文每次修改另存新檔
thesis_v1.docx
thesis_v2.docx
thesis_final.docx
thesis_final_real.docx
……(檔案爆炸)
→
Git 場景
一個檔案,完整歷史
只有一個 thesis.docx,但 git 記得你每次的修改。需要時可以說「給我看上週三的版本」、「給我看新增第三章前的樣子」。
關鍵區分 Git ≠ GitHub。 Git 是本機的版本控制工具(你電腦裡的時光機);GitHub 是雲端的 Git 倉庫服務(雲端的備份+分享平台)。你可以只用 Git 不用 GitHub,但通常會一起用。

Git 的三個核心動作(90% 的時候只用到這三個)

git add:選擇哪些修改要記錄

像是把「要寄出的信件」放進信封,雖然還沒寄,但已經準備好了。

git commit:正式記錄這次修改

像是「封信並蓋章」。這次修改正式進入歷史,並加上一句說明(commit message)。

git push:把記錄推到雲端(GitHub)

像是「把信投進郵筒寄出」。這次的所有 commits 同步到 GitHub。

實際看一次 Git 的歷史長什麼樣子

每個 commit 都有時間、唯一識別碼(hash)、說明訊息:

2 hours ago
a3f2e8b
改用環境變數讀取 API key
yesterday
7c1d4f9
新增日語翻譯範例
yesterday
e5b8a23
第一次成功呼叫 Gemini API
2 days ago
1d6f0c7
Initial commit

第一步:在本機建立 Git repository

SHELL 初始化本地 git 倉庫
# 1. 建立一個資料夾,把剛才的 translate.py 放進去
$ mkdir my-first-api
$ cd my-first-api
$ cp ~/translate.py .

# 2. 初始化 git(讓這個資料夾被 git 追蹤)
$ git init
Initialized empty Git repository in .../my-first-api/.git/

# 3. 把 translate.py 加入「準備記錄」清單
$ git add translate.py

# 4. 正式記錄這次修改(commit)
$ git commit -m "我的第一次 API 呼叫"
[main (root-commit) 1d6f0c7] 我的第一次 API 呼叫
 1 file changed, 10 insertions(+)

# 5. 查看歷史
$ git log
commit 1d6f0c7... (HEAD -> main)
Date: ...
    我的第一次 API 呼叫
剛剛發生了什麼 你的 translate.py 現在不只存在於檔案系統,還被 git 永久記錄了。即使你之後把整個檔案改成空白,也能用 git checkout 1d6f0c7 找回現在的版本。

第二步:把本機 repository 推上 GitHub

到 github.com 註冊帳號

免費,建議用學校信箱(可申請學生方案)。註冊後務必驗證 email。

建立一個新的 repository

右上角「+」 → New repository → 命名 my-first-api → 選 Public → 不要勾選「Initialize with README」(因為本機已有檔案)→ Create

GitHub 會給你幾行指令——複製貼上

就是下面這幾行(替換成你的帳號)。

SHELL 把本機 repo 連結到 GitHub
# 1. 告訴 git「我的雲端 repo 在這個網址」
$ git remote add origin https://github.com/你的帳號/my-first-api.git

# 2. 把預設分支改名為 main(GitHub 的慣例)
$ git branch -M main

# 3. 推上去!
$ git push -u origin main
Enumerating objects: 3, done.
...
To https://github.com/你的帳號/my-first-api.git
 * [new branch]      main -> main

  ← 你的 translate.py 現在已經在雲端,任何人都看得到
檢核點 打開 github.com/你的帳號/my-first-api,能看到 translate.py 的內容 → 成功。
但等等——API key 沒被推上去吧? 因為剛才的 key 是用環境變數,沒寫進 translate.py,所以安全。如果你的程式碼裡有 api_key="AIzaSy...",立刻改!

之後修改 → 推送的標準流程

SHELL 日常 git workflow
# 改完程式碼後,這三行幾乎每次都一樣
$ git add .                              # 加入所有修改
$ git commit -m "新增韓語翻譯功能"     # 記錄修改
$ git push                                # 推上雲端

# 整個過程 30 秒。記住這三行 = 學會 git 80%
PART 3

部署:從「自己管伺服器」到「一鍵」

60–85 min

「部署」(deployment)的意思是:把你的程式從本機搬到雲端,讓別人也能用。這個概念聽起來簡單,背後有 30 年的演化史。理解這段演化,才能理解為什麼今天的技術讓我們可以「一鍵部署」。

類比:開一家餐廳

傳統做法
自己蓋餐廳
買地、蓋建築、裝水電、買廚具、雇人、開門做生意 — 什麼都要自己負責,但完全自由。
→
現代做法
在百貨美食街開攤位
百貨提供場地、水電、清潔、收銀系統 — 你只要專心做菜。比較貴一點點,但少了 99% 的麻煩。

三種部署模式比較一下:自由度 vs 麻煩程度

1990s–2010s
VPS · 虛擬主機
DigitalOcean · Linode · AWS EC2
租一台空白的 Linux 機器,從零開始裝環境、設定防火牆、自己處理安全性更新。
✓ 完全自由,便宜($5/月起)
✗ 要懂 Linux、SSH、nginx
2010s–現在
PaaS · 平台即服務
Heroku · Render · Railway
把伺服器管理藏起來,你只要把程式碼推上去,平台自動處理執行環境、scaling、SSL。
✓ 一鍵部署,省心
✗ 較貴,自由度降低
2020s · 趨勢
「一鍵」雲端
Vercel · Zeabur · Cloudflare Workers
新世代的做法,連 Dockerfile 都不用寫,只要連結 GitHub 就好。每次 push 時,會自動重新部署。
✓ 零設定,免費額度大
✗ 黑盒子,遇問題不好查
趨勢的核心 把伺服器管理「外包」給平台。你只負責寫程式碼,其他全包給雲端。 對 vibe coding 來說這是完美的,讓你能專注在「想做什麼」而不是「怎麼讓它跑起來」。但代價是你犧牲了一些靈活性與控制權。

什麼時候用哪一種?

場景推薦方案原因
學生作業、個人原型「一鍵」雲端Vercel / Zeabur / Streamlit Cloud : 免費額度足夠,零設定
中型團隊、穩定產品PaaSRender / Railway : 稍微付費,但更穩定、有更多控制權
大型企業、特殊需求VPS / KubernetesAWS / GCP / Azure : 成本與複雜度高,但完全可控

最小可行部署示範(Zeabur · 約 5 分鐘)

我們把剛才推上 GitHub 的 my-first-api 部署到雲端。不需要記住每個細節,這部分主要是讓你看到「一鍵」是什麼意思。

到 zeabur.com 用 GitHub 登入

授權 Zeabur 讀取你的 GitHub repository。

Create Project → Deploy New Service → Git

選你剛建立的 my-first-api repo。Zeabur 會自動偵測這是 Python 專案。

設定環境變數

到 Variables 分頁 → 加入 GEMINI_API_KEY 並貼上你的 key。這就是「不把 API key 寫死在程式碼」的真正原因——雲端在執行時才把 key 注入。

等 1–2 分鐘 build 完成

Zeabur 自動安裝套件、啟動程式。完成後給你一個形如 my-first-api.zeabur.app 的網址。

請注意 本週的 translate.py 是一次性的腳本(只 print 一次就結束),雲端跑完就停了。這對純 CLI 程式來說是正常的。真正讓網站「活著」需要加上 Flask,這部分留給期末專案實作需要的時候再學。
本週的關鍵理解

「部署」就是把程式碼從本機推到雲端,讓平台幫你跑起來。期末專案會把它應用在一個會持續運作的網頁應用——Flask + HTML 介面 + API + 部署,整個流程你今天都看過了。

收尾

學期 Lab 系列總回顧 × 期末專案指引

85–90 min

本週是學期最後一場 Lab。讓我們回顧這七堂課累積了什麼。你會發現,每一塊都已經會了,期末專案不是新東西,是把這些組合起來。

Lab 1
個人數位名片 HTML / CSS / JS 基礎
前端基礎
Lab 2
日語假名遊戲 & 詞彙卡 單一 HTML 檔的互動應用
前端互動
Lab 3
CLI + Ollama 指令列操作、本地 AI、批次文本處理
本地 AI
Lab 4
Markdown 與 AGENTS.md 用 Markdown 設定 agent 人格
人格設計
Lab 5
蒸餾人 SOUL.md / USER.md / Skills 整合
自我蒸餾
Lab 6
Hermes Agent 安裝 本地 agent 環境(助教課)
環境建置
Lab 7
API + Git + 部署(本週) 把一切串到雲端
傳遞層

接下來,一起練習做一個微期末專案:一頁式語言學習小卡

專案故意設計得很小,目的是讓你體驗到「想法到落地」的完整過程,而不是被技術細節壓垮。

給焦慮的同學 課程網站上有完整的範本和 step-by-step 指引。在這個階段,能跑起來 比 很完美 更重要。階段一只要 70 行 HTML,很快就能完成;階段二的部署是加分項,不勉強。
很多人一輩子有過好幾個 idea,但從來沒做出來過。完成這個小專案後,你已經跨過了那個門檻。以後有想法的時候,希望你們會本能地反應「我可以做出來!」。這個信心,比任何具體技術都珍貴。