從零到上線：用 Cloudflare、TypeScript、Claude Code 生一支 LINE Bot

這份筆記給對新科技好奇、但沒寫過 code（或 20 年前停下來）的朋友。我把最近做的小專案：關鍵字觸發、自動寄信附件的 LINE bot 簡單介紹一下。

同事 A 這份合約幫我傳一下 📎 contract.pdf

同事 B 寄出去給 PM

小幫手 📨 已寄出 1 個檔案～

整個服務跑在 Cloudflare 全球節點上，每月花費 $0，不需要租伺服器、不需要綁信用卡。從規劃、寫 code、撞牆、到部署上線，全程跟一個 AI 助手（Claude Code）對話進行。

閱讀時間 ~25 分鐘 · 可從左側目錄（手機在三條線漢堡裡）跳讀

整體架構：5 個拼圖怎麼合作

想像一個團隊群組 bot：當有人說某個關鍵字（例如「寄出去」），bot 就把這句話之前的幾個附件檔案整理好、寄到指定的 email 信箱，這需要 5 塊拼圖：

5 塊拼圖：LINE 平台、Worker 函式、SQL 資料庫、key-value 儲存、寄信服務

5 塊拼圖各自的角色（少量個人使用都完全免費）

LINE 平台：聊天群組本身。每當有人講話、傳檔案，LINE 把事件「快遞」到你指定的網址（這個動作叫 webhook）。
Cloudflare Worker：程式碼活在這。Cloudflare 在全球幾百個資料中心都備好機器，誰先收到 LINE 的快遞，誰就跑你的 code。
D1 資料庫：迷你版 SQL 資料庫，用來記錄群組裡最近的訊息（誰說了什麼、傳了什麼檔）。
KV 儲存：key-value 倉庫，用來存實際的檔案 binary。
Resend：寄信專用的第三方服務。Worker 呼叫它，它幫你把信送到收件人。

接下來三節，分別介紹 LINE 平台、Cloudflare 三件套（Worker / D1 / KV）、Resend。

LINE bot 在 LINE 裡是什麼

你每天用的 LINE 是「個人帳號」，跟朋友聊天。LINE 平台另外有一種叫 LINE Official Account（簡稱 OA，舊稱 LINE@）的帳號類型，原本是給商家、品牌、公眾人物用的⋯⋯但個人也能免費開一個。

所有 LINE bot 都是這種 OA。bot 在群組裡看起來就像一個有頭像、有名字的成員，可以收訊息、可以講話。

事件「快遞」：webhook 是什麼

OA 申請開通 Messaging API 後，會給你一段網址欄位「webhook URL」要你填。只要填了、你的服務器（這裡是 Cloudflare Worker）就會收到群組的所有事件：

webhook 的傳真機比喻

想像 LINE 在某個機房裡有一台傳真機。你跟 LINE 說「以後群組有任何事，請把資料傳真到 https://my-bot.workers.dev/webhook 這個號碼」。

之後群組裡每有人講話、有人傳檔、有人加入退出，LINE 就會自動「傳真」一份事件描述（JSON 格式）過去。你的 Worker 收到後決定要怎麼處理。

怎麼開自己的 LINE bot

用 LINE 帳號登入 LINE Official Account Manager 開一個 OA（免費，不需公司營業登記）
在 OA 設定裡啟用 Messaging API，獲得「Channel Secret」與「Channel Access Token」兩串字串（你的 bot 身份證）
把 OA 加進你想放 bot 的群組（先確認 OA 設定允許「加入群組」）
把 webhook URL 填回去，bot 就活了

現代後端：Cloudflare 三件套（Worker / D1 / KV）

這節是技術轉換最大的地方。20 年前我們學的後端大概長這樣：你租一台機器（或自己組一台）、灌上 Linux、裝 Apache、寫 PHP / Perl 程式丟進去、設個資料庫（MySQL）、用 cron 排定時任務。要部署就 SCP 上去、重啟 service。

現代 serverless 平台把上面整串作業大幅簡化。Cloudflare 提供的這套搭配尤其乾淨：

💡 「serverless」是什麼意思

傳統做法是你租一台伺服器（或一台 VM），24 小時開著等別人連進來，每月固定付錢。serverless 翻轉這件事：你的 code 是一段「等別人呼叫才會執行」的函式，平台幫你管所有底層機器。沒有人呼叫時什麼都不跑、什麼都不收錢。Cloudflare Worker 就是 serverless 的代表作之一。

對個人小專案來說，這幾乎等於：你的 bot 沒人用時免費，有人用了才產生（極少的）流量計費，且大部分流量在免費額度內。

Cloudflare Workers

請 Claude Code 寫一個 TypeScript 程式，處理「收到一個 HTTP request (也就是上面說的，來自 Line 的要求) 的時候要做什麼、回什麼」。

把這段 code 用一個叫 wrangler 的命令列工具上傳，幾秒後 Cloudflare 就把它部署到全球 200+ 個資料中心。任何網路上的請求打到 Worker 的網址，地理上最近的那個資料中心會接手執行。

你不需要：管 OS、裝套件、開防火牆、申 SSL 證書、排 deploy 流程。你只負責「函式裡寫什麼」。

關於 TypeScript

Worker 用 JavaScript 或 TypeScript 寫；這個專案選後者。TypeScript 是 JavaScript 加上「型別標註」，能在編譯前抓出大半的拼字錯與型別錯誤。語法差異不大，不用自己寫的話 XD 大概都看得懂。

什麼是「邊緣」(edge) 計算

傳統服務通常只在一個地方（例如美西的某個機房），全世界的請求都得連過去。延遲長、單點故障風險高。

邊緣計算 = 把你的 code 同時部署到全球幾百個節點，誰離使用者近誰執行。LINE 從日本送來的 webhook 會由 Cloudflare 東京節點接、處理、回應，全程不用繞太平洋。

D1（SQL 資料庫）

D1 是 Cloudflare 提供的迷你 SQL 資料庫，底層用 SQLite（手機 App 也常用的同款引擎）。在 Worker 裡能像用 MySQL 一樣下 SQL 喔！

適合存「結構化、需要查詢、有關聯」的資料：訊息紀錄、使用者表、設定值。免費額度：5GB 儲存、每天 500 萬次查詢；對個人專案來說等於無上限。

Workers KV（key-value 儲存）

KV 像個雲端版的字典：你給它一把鑰匙（字串）跟一個值（字串、JSON、binary 都行），之後可以用同一把鑰匙取出。沒有 SQL 查詢能力，但快、便宜、內建過期機制。

適合存「不需查內容、純粹按 key 取出」的東西：檔案 binary、cache、暫存。免費額度：1GB 儲存、每天 1,000 次寫、10 萬次讀。

寄信靠 Resend

歷史上，從伺服器寄信很麻煩，要設定 SMTP server、處理寄件人信譽、避免被當垃圾信擋掉。Resend 把這些變成幾乎透明的服務：3 分鐘註冊 + 一個 fetch() 呼叫，搞定。

免費額度：100 封/天、3,000 封/月。對個人專案、團隊群組、小工具來說綽綽有餘。

需要一個自己的網域

Resend 要求你寄出去的信使用「你自己的網域」（例如 bot@your-domain.com），不能直接用 Gmail 或免費信箱。網域年費 $10-20 美金，租一個放著 10 年也才一杯咖啡。

網域驗證需要在 DNS 設一些紀錄（讓收件方知道你這個寄件位址是真的），Resend 會把要設的紀錄列給你，一次性的事。詳細的 SPF / DKIM / DMARC 機制（背後的「寄件人信任鏈」）有興趣可以問專業的 email 廠商⋯⋯ 哈哈。

跟 AI 一起寫 code 是什麼體驗（Claude Code）

這是這份筆記最想讓朋友看到的一節。我自己 20 年沒認真寫程式了，這次能做出這個 bot，用了大名鼎鼎、所有 RD 都推薦的 Claude Code。

Claude Code 是 Anthropic 出的 AI Agent，它能讀你電腦上的檔案、執行命令、開瀏覽器查資料、跟你對話討論需求。它不只是聊天網頁版那種「我問你答」，而是能直接動手做事的助手。

實際工作節奏長這樣

整個專案的工作流大概是這樣的循環：

我描述需求：「我想做一個 LINE bot 在群組監聽，當某人說『XX』就...」
它規劃：列出可能的技術選項、各自優缺點、推薦做法、估時。問我幾個關鍵決定（例如 serverless 平台選哪家、寄信走 Gmail OAuth 還是第三方 API）
我拍板：選方向、丟出條件（例如「絕對不要綁信用卡」）
它寫 code：建檔案結構、寫 TypeScript、寫 SQL schema、設定檔
遇到問題它查、它改：查官方文件、跑型別檢查、解 bug
我 review + 拍板修改：每次它要做大決定（裝套件、刪檔、改架構）都會問我
commit + push：每個段落結束時自動寫 commit message、push 到 GitHub

真實的「撞牆 → 繞路」例子

這個專案有兩次「原本計畫不可行、AI 幫忙找替代方案」的轉折：

轉折 1：Gmail 寄信變 Resend

原本計畫用 Google 自家的 Gmail API 寄信，從我自己 Gmail 出去。AI 在實作前幫我查到一個關鍵細節：Google 對「寄信」這種敏感權限，免驗證的 OAuth app 只能用 7 天就過期。要過期不重設？得提交 Google 公司審核（要應用網站、隱私政策、demo 影片、等好幾週）。對個人小專案根本不可行。

AI 提了 Resend 替代，列出 trade-off：寄件人地址要改用自己網域（我有），其他設定都簡化。我點頭，10 分鐘後改完。

轉折 2：R2 變 KV（中間還繞了一次 D1 BLOB）

原本計畫用 Cloudflare R2（物件儲存，類似 AWS S3）存檔案。實作到一半才發現：R2 即使免費額度也要綁信用卡才能啟用，違反我的「絕對不要爆帳單」原則。

AI 第一輪建議改用 D1 直接存 binary（D1 支援 BLOB column）。我同意，改完後它去查文件，發現 D1 單列上限 2MB，PDF 一定爆。它接著提出第三方案：用 Workers KV（單值 25MB，不需綁卡）。我們再次調整，這次成功。

整個來回約 30 分鐘，期間我做了「不要綁卡」「PDF 通常 5-10MB」這幾個 trade-off 判斷，code 細節 AI 處理。

AI 在這場合作中的角色

工程師：我給方向，它把細節展開成可執行的計畫與程式碼。我不需要懂 D1 的 SQL、不需要記 LINE webhook 的 JSON schema。
查文件：每次撞到不確定的細節，它直接打開官方文件、給我引用。比 Google 搜尋有效率太多。
做記錄：它在 commit message、變更紀錄裡寫下「為什麼這樣改」，未來我或別人看 git history 都看得懂。

它（還）做不到的事，人類請放心，還有你要做的事

登入/註冊各個雲端服務（Cloudflare、Resend、LINE OA 的設定）
在 LINE 群組裡邀請 bot、用手機傳檔案測試
一些大原則（例如一定要免費，以及不用掛信用卡）以及喜歡討厭的事，當然是由人類決定

整個過程像跟一個耐心的、技術很熟的、不累的聽話的工程師，用嘴巴叫他寫 code，過程不能說很快，但是挺有趣的！而且做完蠻有成就感的。

$0 / 月：現代 free tier 列表

這個 bot 月費 0 元，全部服務都在免費額度內：

服務	用途	用量 vs 免費額度	月費
Cloudflare Workers	跑程式	~200 請求/月 vs 100k/天	$0
Cloudflare D1	SQL 資料庫	~50 MB vs 5 GB	$0
Cloudflare KV	檔案 binary	~5 寫/週 vs 1k/天	$0
Resend	寄信	~10 封/週 vs 100/天	$0
LINE Messaging API	聊天平台	~50 推送/月 vs 200/月	$0
GitHub	程式碼倉庫（private repo）	1 個 repo	$0
自有網域（年費）	寄件人地址	1 個 .info 網域	年費美金 $18 左右
Claude Code 訂閱	AI 助手	—	美金 $20 起

除了 Claude Code 訂閱費，專案本身營運成本接近零。Cloudflare 整套不需要綁信用卡就能用。

為什麼這些服務這麼大方

免費額度看起來像在做慈善，其實是平台的獲客策略：讓你免費跑個人專案、習慣他們的工具，等你哪天做出有規模的服務、超過免費額度，自然就升級付費。對個人小工具與 side project 來說，這個生態極為友善。

參考連結 / 你也想做嗎？

看完還是覺得「想試試」？以下是我用過的服務官網與入門資源：

LINE 平台

LINE Official Account 介紹 — bot 帳號是什麼
LINE Messaging API 文件 — 開發者文件
LINE Official Account Manager — 註冊 OA 的入口

Cloudflare

Resend

Claude Code

Claude Code 官網（下載 + 文件）
Claude / Anthropic 訂閱方案 — 個人方案 $20/月起，含 Claude Code 額度

動手的方向感是這樣的：先打開 Claude Code 跟它聊你想做什麼、讓它幫你規劃。它會帶你選平台、開帳號、寫 code、debug、上線。整個過程你不需要事先學會 TypeScript 或 Cloudflare，邊做邊問就好。

會撞牆，你會困惑，AI 會給你錯方向（很少但會），但整體會把你帶到能跑的東西。最快的學法就是有個目標、有個 AI 夥伴、有時間。

軟體就是用來幫助人類的～快來使用它吧！ 🛠️