はじめに
アウトプット用として個人ブログを始めたいと思い、今回HugoとGitHub Pagesを使ってブログを作成しました。
静的サイトジェネレーターの選定
MarkdownからHTMLを生成する静的サイトジェネレーターで有名なものとして、以下の2つがあります。1
今回はGitHub Starsが多く、更新もより頻繁なHugoを使っていきます。
！注意
これらのGitHub Stars数は2023年11月時点のものです。
テーマの選定
GitHubのhugo-themeトピックで、GitHub Starsが多いテーマから選びました。
- Hugo PaperMod 🪧デモ
- シンプルなテーマが好みならこれ。
Hugo Blox Builder（Builderなので除外）- Hugo Theme Stack 🪧デモ
- 私はこちらを選びました。PC画面でカテゴリやタグのまとめが右に出ているのがよかった。
- Hugo Academic CV Theme 🪧デモ
- 執筆、出版、登壇が多い人はこちらがよいかも。
- Hugo LoveIt Theme 🪧デモ
- ホーム画面で各記事ごとに著者情報が付与されているので、複数人で各々が投稿するならこれ。
私はHugo Theme Stackを選びました。 テーマ選びは個人の好みに大きく左右されますが、上記の選択肢は参考になると思います。
GitHub Pagesの設定
各テーマにはテンプレートとガイドが用意されているので、それらにしたがって操作をおこなえば問題なく完了できます。 私が選んだテーマにも、starterというテンプレート用意されており、それに沿って設定をおこないました。 基本的には、使用するテンプレートのREADMEとGitHub Pagesのクイックスタートを読めば準備完了です。
GitHubリポジトリのmainブランチにpushすることで、テンプレートに含まれている.github/workflows/*.ymlに基づいてGitHub Actionsが実行されます。
これによりサイトは自動的にビルドされ、最終的にhttps://<user>.github.io/のURLでwebサイトが公開されます。
👀補足
ビルドから公開までにはタイムラグがあったりします。気長に待ちましょう☕。 10分以上たってもwebサイト表示されない、あるいはリポジトリのREADMEが表示される場合は、 GitHub Pagesサイトの公開元設定が正しいか確認してみましょう。
まとめ
今回はHugoとGitHub Pagesを使用してブログを作成しました（このブログです🎉）。 デプロイまでは非常に簡単で、試す価値は十分にあります。 ただし日本語対応のようなカスタマイズを行うさいには、少々の難所やバグに出会うかもしれませんが、そういうものだと目をつぶってください！
ちなみに私は、どのテーマを選ぶべきか、他のテーマの方が見栄えが良いのではないかと迷い、時間をムダにしました。 しかし、最終的には、見た目の美しさよりも内容の豊かさが重要です。 見た目をとっかえひっかえせずに投稿していこうと思います。
では、さようなら～👋