Lee Ryan HQ · Article

2026-11-03

CloudflareSupabase網站

用 Cloudflare Pages 與 Supabase 架個人網站的實務筆記

分享 Lee Ryan HQ 選擇 Cloudflare Pages + Supabase 的原因、基本架構與維運注意事項。

← 作品集 文章列表 回首頁

Lee Ryan HQ 目前跑在 Cloudflare Pages,資料與登入走 Supabase。這篇不是廠商文案,而是個人站長在台北實作時會碰到的取捨。

為什麼是 Pages 個人品牌站需要全球 CDN、簡單預覽網址、與 Functions 處理表單或管理 API。Pages 對靜態前端很友善,自訂網域與 HTTPS 也相對省事。對我這種以內容與互動場景為主、尚未做複雜後台電商的階段很合適。

為什麼是 Supabase 需要會員、資料表、權限與之後商店資料時,Supabase 的 Postgres 模型比純鍵值儲存直覺。我們把 HQ 相關表放在獨立 schema,避免與其他專案表混用。公開讀取用視圖,寫入走受保護的遠端程序或後端函式。

前端形態 第一版是單頁應用。對搜尋與廣告審核而言,純單頁不利於爬蟲讀文字,所以文章改以靜態 HTML 輸出在文章路徑下,讓 Google 直接抓到正文。互動辦公室場景仍由前端應用負責。

環境變數與密鑰 瀏覽器只放公開金鑰。管理密碼、寫入權杖、第三方密鑰放在 Cloudflare 的密鑰設定,不進版本庫。本地環境檔不上傳。這是基本功,但很多人第一次接登入時會踩雷。

維運節奏 部署前看建置結果,部署後抽查首頁、作品集、一篇文章、隱私權與廣告文字檔。搜尋控制台定期看收錄。內容更新比改版動畫更影響審核結果。

實作時的記錄習慣 每次成功的一格,我會留下三行筆記:用了哪個模型、哪一段提示最關鍵、哪一個失敗被負面擋下。一週後回看,比憑感覺調參更快。筆記可以是純文字,不必漂亮,但要能搜尋。

把筆記公開寫成文章時,記得去掉金鑰、帳號與未釋出的劇情雷點。公開的是方法,不是後台。讀者需要的是可遷移的原則,而不是你的私人環境變數。

和讀者溝通的方式 若你在 Threads 或 Instagram 分享過程,試著講這一格我改了什麼,而不是只丟成品。過程內容之後也能擴寫成網站文章,形成創作與網站互相餵養的循環。

最後回到動機:工具會換,平台規則會變,但清楚的分鏡頭腦與誠實的內容經營比較耐用。把基礎打穩,之後無論模型升到哪一版,你都還有可執行的流程。

延伸閱讀與自我檢查 完成本篇後,建議回到作品集把相關文章互相連結,並確認首頁已放上最新文章入口。對廣告審核而言,內部連結能幫助爬蟲發現內容;對讀者而言,也能降低跳出後找不到下一篇的挫折。持續小步更新,比一次丟大量空頁更有說服力。

備份與災難想定 即使平台穩定,也要能匯出文章與重要設定。靜態文章本來就在版本庫裡,這是優點。資料庫則定期確認遷移檔與種子資料仍能重建。個人站的災難復原不必企業級,但要知道「從零部署要多久」。