Gatsby のサイトを GitHub Actions でデプロイする

February 21, 2021

このブログは Netlify の無料プランでビルドとホスティングをしており、月 300 分のビルド時間上限と、100 GB の転送量上限がある。転送量上限は置いておいて、ビルド時間上限は記事が増えてくると到達するかもしれない。

Netlify にログインすると無料枠の残量が確認できる
Netlify にログインすると無料枠の残量が確認できる

上限に到達したら 7 USD 払えばいいとも思ったが、ブログを書く心理的障壁をできるだけ取り除いておきたいと言う気持ちになり、Netlify で行っていたビルドを GitHub Actions で行うことにした。

GitHub Actions のいいところ

public リポジトリだと無料なのでビルド時間を気にしなくてよい。あとはもちろん GitHub との連携が楽なのと、あるあるな処理には Action が存在し、シェルスクリプトをあまり書かなくて済むのが良い。

作業

まず Netlify 上のサイトの設定でビルドが走るのを止める。

このラジオボタンをこうする
このラジオボタンをこうする

次に GitHub Actions の設定ファイルを書く。あまり変わった点はないが、GitHub の example どおりにパッケージをキャッシュした。npm ci でパッケージをインストールし、.npm をキャッシュするのが最近の正しいやり方らしい。

ソースコードはこちら。

© 2023 Kosuke Ohmura