ずっと面倒だと思っていた。
ファイルを更新するたびに、Cloudflareのダッシュボードを開いて、フォルダを丸ごとドラッグ&ドロップしてアップロードする。毎回同じ手順。1分もかからない作業ではあるけど、じわじわと「これ、もっとラクにならないのか」という気持ちが積み重なっていた。
そこで今回、GitHubと連携してpushするだけで自動デプロイされる仕組みを作ることにした。
まずGitHubアカウントを作るところから。Googleアカウントでサインアップしようとしたら、途中でパズル認証が出た。サイコロの展開図みたいなやつで、「表と側面の数字を合計せよ」的な問題だった。
初手からつまずいた。
なんとか突破して、リポジトリ(ファイルの保管場所)を作成。ブログのHTMLファイルたちをアップロードして、GitHubへの第一歩は完了。
次にCloudflareとGitHubを繋ぐ設定へ。「Connect GitHub」ボタンを押したら、Workersのセットアップ画面に進んでしまった。
Workerというのは、サーバーレス関数(ざっくり言うと「サーバーなしで動くプログラム」)を動かすための仕組みで、静的なHTMLサイトには向いていない。`npx wrangler deploy`というコマンドが必要で、設定ファイルも別途用意しないといけない。
一度戻って、Cloudflare Pagesという静的サイト専用の仕組みを探す羽目になった。画面下の小さい文字「Looking to deploy Pages? Get started」——これが正解への入口だった。
Pages側でGitHubリポジトリを選んで設定完了。あとはローカル(自分のPC)のフォルダとGitHubを繋ぐだけ——のはずが、ここが一番手間取った。
Gitコマンドを実行するたびにGitHub認証のポップアップが出て、ブラウザでログインして、でも認証情報が保存されなくて、また聞かれて……という無限ループ。最終的にはGit Credential Managerの「Token」タブからPersonal Access Token(パスワード代わりのキー)を入力する方法で突破した。
認証が通った瞬間の`git fetch`の成功メッセージは、妙に嬉しかった。
あとは試すだけだった。記事ファイルを作って、`git push`を実行。数分後にサイトを確認すると、ちゃんと反映されていた。
ドラッグ&ドロップ、不要になった。
地味な作業だったけど、これで今後はファイルを編集してpushするだけでサイトが更新される。Claudeが編集して、GitHubに送って、Cloudflareが自動で反映する——この流れが完成した。
1日かけてインフラを整えた感じがある。ちょっとした達成感だった。