GitHubとCloudflare,Hugoで自分のホームページを作った話

数年前にドメインを買い,ウキウキで中華ミニPCを用意し自宅鯖によるホームページを立ち上げていた蓼科だったが... ...

蓼科です.

今回はこのホームページの構成について自分への備忘録も兼ねて超ざっくりと書き記しておきます.

昔々,唐突に自分の名前のドメインが欲しくなった蓼科という名前の奴がおったそうな.

そのころの奴にはwebサイトの知識もドメインの知識も何もないが,好奇心だけはあったとな.ノリと勢いに任せてお名前 .c〇mでドメインを購入,登録したメールアドレスにスパムの如く〇名前からのメールが届く中,自宅にあったミニPCにProxmoxを入れ,WordPressベースのホームページを開いたそうな.

喜びもつかの間,鯖用でもなんでもないミニPC(当時は友人たちとのマイクラ鯖も24365で回していた)は儚くもファンが壊れ全部お亡くなりになったそうな.

おしまい.

と実際ここで物価高騰やらAIバブルやらで自作PCの価格が上がり始め,その時壊れたミニPCでさえ購入当時(確か)1万円強だったものが同程度の性能のもので3万程に値上がりしており,鯖用に満足のいく性能のマシンを買うには余裕で10万円を超える有様であった.

そんなこんなで数年間放置されていたのだが,GitHubやらCloudflareやらを少しづつではあるが,ちゃんと[要出典]使い始めて来て気がついた.

GitHubに本体を置いて公開すれば別に自宅鯖は要らないのでは.

自宅鯖は楽しい.これは事実だ.特にまだAIも発達してなかった頃に,偉大な先人方の個人ブログやはてなブログ,専門用語となると途端に機能しなくなるgoogle翻訳で碌に整備されていない公式のドキュメントを漁り,色々試行錯誤するというのは非常に貴重な経験であるし楽しかった.

が,自宅鯖はなにより金がかかる.マシンの本体はより性能の良いうるさいものが欲しくなるし,それを24365で動かしたら電気代が馬鹿にならない.自身のホームページに広告でもつければ金の足しにもなったのかもしれないが,私の思想としてそれはいただけない.

ドメインについてはお〇前.comの無料期間の終わる前にGM〇からのメールがうっとうしいのと管理画面が死ぬほど使いづらいことに嫌気がさし,お名〇.comでの購入から確か半年もたたずにCloudflereRegistrarに移管していた.(CloudflereRegistrarはいいぞ.安いしなにより流石は超大手のCDNなだけあって管理用の機能が充実している.欠点としては支払いがドル円に影響されるのと,当たり前ではあるがjpドメインは無理なところぐらい.サブドメインに関してもちょっと制限があるけど個人的には許容範囲内.)

という訳で昔何も考えずにCloudflereにドメインを移管していたわけだがコレが非常に良い選択だった(自画自賛)

CloudflereにはCloudflereWorkersという

“アプリの構築、展開、スケーリングのためのサーバーレスプラットフォーム”(公式ドキュメントより一部抜粋)

が用意されており,なんとコレが無料で使えるというのだ.

さらにはGitHub連携機能があり,任意のリポジトリにも接続できるという.即ちGitHubへのpushを起点にGitHubActions側ではなくCloudflere側で本番へのデプロイを走らせられるのだ.

GitHubPagesは便利ではあるのだが,課金をしない限りプライベートリポジトリでは利用できない点がネックであった.しかしCloudflereWorkersはその悩みを解決してくれるのだ,

そこが解れば後は簡単である.GitHubにhtml,cssを置くだけである.

おくだけであるとは言ったが,現状そうはしていない.なぜなら私にデザインセンスがないからである.(あと保守管理が面倒くさい)デザインなど色々一通り学んだはずではあるが,所謂センスというやつはからっきし身につかなかった.そしてそもそも,ブログの用途として雑に書いてもなんか動いてしまうhtmlだけならともかくcssを毎回当てるのは辛い.

ではどうするか.他人の力を借りるのである.人に頼るのは恥ではない.適材適所というやつだ.

要件としては自分のサイトに動的要素を入れるつもりはないし,どこまで行ってもブログ的運用しかするつもりはない.この用途に於いてWordPressは重いしリッチすぎる.

そこで静的サイトジェネレータを探したところ,AstroやNext.jsがあるらしい.

静的サイトジェネレータの人気順を見れるサイトがある→https://jamstack.org/generators/

個人的な思想としてjsが好きではないので,どうせなら非js系のものが良い.となると選択肢は限られてきて有名どころの中だとGoベースのHugoが残った.売りは何といってもビルドの高速さとのこと.

「こういうのでいいんだよこういうので」おじさんの誕生である.

という訳でHugoベースに決定した.あとはGitHubにリポジトリを立ててとりあえずローカルに構築したものをアップロードして終わりである.

何ともあっさりと終わった.

しかし課題はある.人は次から次へと欲を生み出すもので,現状これではgitにアクセスできる環境でないとページが更新できない.正直大した問題ではないのだが,ブログなんだからスマホや持ち運び用のPCからでも投稿や編集ができた方が楽しいというものである.

正直そこから先の筋道が浮かばなかったのでAI(Claude)君に聞いてみた.

Q.こういうブログシステムを作ったんだけどwebから編集と投稿できるようにできない?
A.CMS使えばできるよ

とのことだった.

できるのか.

Claudeからどれがいいか聞かれたのち,Sveltia CMSを選んだ.

なにより軽量高速らしい.Hugoにピッタリじゃないか.あと,mdをそのまま編集もできるらしい.静的サイトジェネレータ連携だからマークダウン編集も可能なのは当たり前だと思っていたが,意外とそうでもないらしい?

認証専用に別リポジトリを立てる必要があるのだが,ボタンポチポチで何とかなる.(なった)

そしてこれは今実際にwebから記事を書いて投稿している.便利なものだ.

私かこの自分用のwebサイトを立てた方法についてはこんなものだろうか.

ダラダラと書いていたが,これを読んだ人の何かの参考になれば幸いである.(役に立つか?)

(かっこ)を多用する辺り古の人間であることは察されているだろうが,矢張りこういった癖は何年たっても治らないものである,

この調子で私的な駄文をダラダラ,それこそGitHubやらCloudflereが亡くならない限りは,また蓼科が元気なうちは書き連ねていくつもりでいるので皆様よろしくお願いしたい.

それでは.

不一

2026/08/09_蓼科千曲/TATESHINA Chikuma

以下余白

Hugo で構築されています。
テーマ StackJimmy によって設計されています。