blog.ryota-ka.me

Netlify でホスティングしている Gatsby 製静的サイトを定期的にビルドして情報を更新する

TL; DR#

  • Netlify の build hook URL を発行する
  • 上記の URL に対して定期的にリクエストが送られるように設定する

モチベーション#

ポートフォリオサイトGatsby で作って Netlify でホスティングしている.そのコンテンツの一部として,gatsby-source-graphql を使って GitHub GraphQL API から自分の profile の pinned items を取得して表示したり,gatsby-source-rss-feed を使ってこのブログの最新記事を取得して表示したりしている.静的サイトとしてホスティングしているため,これらの情報はビルド時に取得され,その時点で得られた値が HTML に埋め込まれる.しかし,こうした情報は低頻度ではあるものの,ポートフォリオサイトとは無関係に更新されるので,最新の情報を定期的に反映するため,一定時間ごとに再ビルドを行いたい.

Build hooks#

調べてみたところ,Netlify は build hooks という機能を提供していることがわかった.これは,Netlify 上で発行した,site に紐付く URL に対し,HTTP リクエストを送信することで,当該 site のビルドおよびデプロイをトリガするものである.

$ curl -X POST -d '{}' https://api.netlify.com/build_hooks/XXXXXXXXXXXXXXX

Settings > Build & deploy 内に Build hooks というセクションがあるので,その中の Add build hook ボタンを押せば build hook を追加できる.

「build hook URL に対して HTTP リクエストを送信する」という操作が定期的に実行されるように設定すれば,やりたかったことは実現できそうだ.

GitHub Actions#

定期実行といえば伝統的には crontab だが,今回は手軽な選択肢として GitHub Actions を使うことにする.

まずはリポジトリの secrets に build hook の URL を設定しておく.これは Settings > Secrets > New secret から行える.名前はなんでも構わないが,ここでは NETLIFY_BUILD_HOOK_URL にしておく.

次に,default branch で以下の YAML が .github/workflows/ ディレクトリ内にある状態にする.今回は毎日0時 (日本時間) にビルドがトリガされるような設定にしている.

指定した時間が来れば,Netlify 上でビルドが開始されるだろう.

所感#

各種クラウドサービスの発展により,個人でサーヴァを借りる時代でもなくなってしまった*1ので,Netlify のようなホスティングサービスはもとより,crontab の代替になるようなものが手軽に使えることは非常にありがたい.このような構成がリポジトリに置かれるべきかどうかについては議論の余地があるように思うが,少なくとも管理は随分と楽である.

脚注#

*1: 6-7年ほど契約していた VPS も今年ついに解約した.