我就免費仔:同步 GitHub 組織的儲存庫到個人帳號,達成 Vercel 的免費部屬 | Daily Oops!
Daily Oops

Daily Oops!

April 24, 2021

我就免費仔:同步 GitHub 組織的儲存庫到個人帳號,達成 Vercel 的免費部屬

免費仔系列文。開發小專案想用 SaSS 服務但又不想花錢嗎?那這個系列文一定要讀讀,不過或許免錢的最貴呢 😂

Vercel & Next.js

Next.js 這套框架讓你快速建構 React.js 的前端網站,甚至包含簡單的後端整合,SSR、SSG 等各項技術也都幫你整合好了。開發 Next.js 的公司就是 Vercel,他們的同名服務 Vercel 就是幫你架設 Next.js 網站的最佳選擇。

Vercel 提供個人免費版,但是如果你想要部屬 GitHub 組織的專案就一定得付錢:

但有時專案一多,勢必要透過 GitHub 組織來管理專案,你又想免費使用 Vercel 時該怎麼做呢?

直覺:同步到 GitHub 個人儲存庫

很簡單,Fork 一份程式碼儲存庫到個人帳號就可以了,然後用 git 新增一個 remote,把程式碼推上去:

git remote add personal git@github.com/Yukaii/my-personal-repo
git push personal main

但每次部屬都要手動推一次到不同 remote,好麻煩呀,我想要自動化!

用 GitHub Actions 來自動化

GitHub Actions 是 GitHub 內建的 CI/CD 工具,常常被人拿來挖礦。我們建立一個獨立的程式碼儲存庫來管理同步 Actions 設定檔。我自己的叫 repo-syncer (github.com/Yukaii/repo-syncer),是私有的所以各位看不到,以下稱為「同步管理儲存庫」。

.github/workflows/sync-repo1.yml

on:
schedule:
- cron: "*/60 * * * *"
workflow_dispatch:
jobs:
repo-sync:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v2
with:
persist-credentials: false
- name: git-sync
uses: wei/git-sync@v3
with:
source_repo: "git@github.com:GitHubOrg/repo.git"
source_branch: "refs/remotes/source/*"
destination_repo: "Yukaii/my-repo"
destination_branch: "refs/heads/*"
ssh_private_key: ${{ secrets.SSH_PRIVATE_KEY }}

強調幾行做說明:

  • 3: 定時每個小時跑一次,雖然是免費仔但也不要太頻繁的利用資源。寫的是 Cron 語法,可以利用 crontab guru 這個工具來輔助,GitHub Actions 的編輯器也會提示你。
  • 16: 記得改成 GitHub 組織內儲存庫的連結
  • 18: 記得改成個人帳號儲存庫的連結
  • 20: 到「同步管理儲存庫」的設定頁面加入 Secret,這裡填的是私鑰。建議可以 產生一組新的 SSH 金鑰 方便管理。記得加到帳號的 SSH 金鑰列表裡頭。

就這樣了

Vercel 綁定等等不在本篇討論範圍,就不寫了。設定完成後可以到 GitHub Actions 的分頁手動觸發 Action,看看程式碼是否成功同步。(點上圖那個 Run workflow

GitHub Actions 模組的設定檔讓我們可以快速復用別人寫好的 Actions,我這次用的 Actions 是 wei/git-sync,可以看到整份設定檔根本沒改幾行,輕輕鬆鬆啊!

如果對「我就免費仔」系列文有興趣,記得訂閱按讚並開啟小鈴鐺,浪漫 Duke 就會帶你找到屬於你的浪漫

本篇文章驕傲的使用 HackMD 發佈