透過結合 Git 版本控制、Github 備份和 Cloudflare Pages 部署，開發者可以建立一個高效、安全且成本效益的現代化網站開發工作流程。不僅提供了可靠的備份機制，還能享受全球 CDN 加速和自動化部署的便利性。
個人建議即便設定為私人，也別把公司機敏性資料上傳至 Github。本方法適合個人專案、Side Project、公開作品集、公開部落格。上傳前請再三確認別把會產生費用 API Key 也放進程式碼裡了。
提供完全免費的雲端部署方案：
- Github 提供免費的公開儲存庫和 Pages 服務。
- Cloudflare Pages 免費方案包含無限流量、20,000 個檔案、每月 500 次建置。
- 適合個人專案、作品集、部落格展示等非商業用途。
▍將網頁檔案備份至 Github
https://github.com/1. 可以用 Google 帳號註冊 並登入 Cloudflare
2. 新建 Repositories
右上角綠色按鈕「New」、或是左上「＋」下拉選單 「New Repositories」
3. 輸入 Repository 名稱後就「Create Repository」
- Description：可以進一步描述專案內容。
- Choose visibility：權限設定 Private 只有自己可以編輯 ( Public 公開是大家都能編輯修改 )
4. 上傳至 Github
可以下載 Desktop 桌機版建立 Github 雲端空間 與 本機端專案連結。或是直接點選「」
5. 拖拉檔案即可上傳
▍將Github檔案部署到 Cloudflare
Github Pages 服務每個帳號只建立一個，Cloudflare Pages 可建立多個網站。免費方案規格： 網站容量不限大小 、網站檔案上限 20,000 個 、單一檔案上限 25MB 、每月建置 500 次。
1. 可以用 Google 帳號註冊 並登入 Cloudflare
2. 選擇 Pages 「匯入現有Git存放庫」來建立網頁空間。
3. 串連 GitHub 賬號
4. 登入 GitHub 並允許
5. 搜尋並選擇 Repositories 名稱
6. 部署完成 「網域」就是已上傳的網頁前端
https://20250922-memory-game.pages.dev/
7. 「設定」變數和祕密
若有使用到 Gemini API Key 或是其他 API Key 可以放到後端這裡。Gemini 生成 React 格式是在前端， API key 放在 .env.local 容易外洩。 記得類型設定為「機密」
