NetlifyからGithub Pagesに移行した

2022, Oct 02

このブログのdeploy環境を今までGatsby+Netlifyで運用していましたが，Netlifyにそこそこ不満が出てきました．

  • 月額料金が結構高い: Proで月額19ドル
  • 課金しても記事追加時のビルドに時間がかかる(本ブログの場合，1ビルド20-30分くらい)

で，よくよく考えてみるとGithub Pagesでほぼ同じことができることに気がつき， カスタムドメインにより独自ドメイン運用もできることがわかったので移行しました． これで月3000円弱浮くぜ

移行作業のざっくり手順

1. Github Pagesのサイト作成

リポジトリ名={username}.github.ioのGithubリポジトリを作成する． このリポジトリの指定したブランチ(デフォルトはmain)の内容がhttps://{username}.github.ioに表示される．

2. カスタムドメイン設定

参考: Managing a custom domain for your GitHub Pages site

2-1 ドメイン側の設定

ALIASとかAとかAAAAでDNSレコード設定する．

2-2 Github側の設定

Settings->Pages->Custom domainにドメインのURLを指定する．

3. Gatsby.jsのコードデプロイ

gatsby build --prefix-paths

ビルド用のコードとデプロイ用のブランチを分けるにはgh-pagesが便利．

npm install gh-pages --save-dev
gh-pages -d public

これを実行するとpublicディレクトリの内容がgh-pagesブランチにuploadされる． {username}.github.io -> Settings -> Pagesの設定でSource=Deploy from a branch，Branch=gh-pagesと指定する．

移行の効果

  • build&deploy時間
    • gatsby build --prefix-paths: 9分45秒
    • gh-pages -d public: 1分52秒

Netlifyよりは速くなった．

参考文献

# web# Gatsby# Github Pages