はじめに

タイトルにもある通り、このブログのホスティング基盤をVPS(Lightsail)からCloudflare Pagesに移行しました。以前のdevocのブログを支える技術with CaddyやAnsibleを用いてこのブログのデプロイを自動化したの記事で述べたように、DockerやAnsibleを使って、コードをpushするだけでいい感じにブログを更新できるようにしていたのですが、無理やり感を日に日に感じるようになり、仕事でフルマネージドの静的サイトホスティングサービスを触る機会もあって、「“簡単でシンプルな仕組み"があるのにそれを使わないのは悪(勉強目的なら別)なのでは？」と思ってしまったので、移行しようと思いました。

どうしてCloudflare Pagesなのか

「Cloudflare Pagesじゃないとダメ！」みたいな理由はないのですが、以下のようなことは考慮しました。

1. Hugoに対応していて、GitHubにコードをpushするだけでビルドを行なってくれる
2. Cloudflare Workersという、FaaSとの連携が考えられていて、今後使ってみたかったから

とくに2つ目の理由が強くて、Cloudflare Workersって100000 req/dayっていう個人利用だとよっぽどのことがないと料金が発生しないだろうっていう価格設定なので、アカウント作っといて損はないなと思いました。（Workersはわからないが、Pagesだけならクレジットカードの登録不要）

移行作業

特に詰まったところはなく、Cloudflare DocsのHugoガイドを読んで作業していけば簡単に移行できたのですが、一点だけ注意点があります。使っているサイトジェネレータによってはビルドの段階でコケる可能性があります。僕の場合はビルド環境でのHugoのバージョンが古いために、ビルドが失敗するエラーに遭遇しました。以下にエラーの遭遇から解決までの手順を上げます。

1. PagesでテンプレートにHugoを選択して、Build CommandやBuild direcotry、環境変数はデフォルトのままでビルドします。
2. 僕が使用しているHugoのテーマm10cはHugoのバージョンが0.55.0以上対応だが、ビルド環境のバージョンは0.54.0だった。
   • ビルドがこける
3. Pagesでは、環境変数を設定することができ、ビルド環境の言語やツールのバージョンは環境変数を用いて管理するので自分の環境に合わせて編集する
   • 変数HUGO_VERSIONに値0.99.1(ローカル環境のHugoのバージョン)を設定
   • 言語別のバージョンを変更したい時は、Build configurationを参照する
4. 再度デプロイを実行すれば、無事デプロイされる

おわりに

アカウント作成から、移行完了まで1時間くらいでできました。使い始める前までは、HugoのビルドはGitHub Actions上で行い、ビルドしたファイルをPagesに設置するのかと思っていたのですが、Pages上でビルドから公開まで行ってくれるのでとても簡単にブログの更新を行えるようになりました。また、時間がある時には、Workersも触ってみたいと思ってます。