はじめに

最近 Github Pages を使って個人ページを作りました（今は削除済み）。この記事では Github Pages でのサイト構築方法および独自ドメインの設定について記録します。

本記事では CMS 等は使用せず、Markdown ファイル1つで書いた簡易なものです。

Github リポジトリの作成

まず Github に登録し、 新しいリポジトリを作成 します。

このときの Repository name は username.github.io としてください。たとえば自分のユーザー名が yexca の場合、yexca.github.io とします。

Git 環境のインストール

Windows では Git の公式サイトから インストーラをダウンロード してインストールすればOKです。

インストール後、Git Bash を開き以下を入力します：

1
2

git config --global user.name "Your Name"
git config --global user.email "[email protected]"

自分の場合はこうです：

1
2

git config --global user.name "yexca"
git config --global user.email "[email protected]"

Github Desktop の利用

インストール

Git 操作に慣れていればスキップしても構いません（慣れてる人はこの記事を読まない気がしますが）

Github Desktop 公式サイト からダウンロードしてインストールします。

リポジトリをクローン

Github Desktop を起動し、ログイン後に空フォルダを選択し、先ほど作成したリポジトリをクローンします。

ソフトウェア右側に変更履歴と各種操作が表示されます。

ここでは VS Code で開く（Open in Visual Studio Code）を選びます。

サイトの作成

README.md を作成して Markdown で編集します（ついでに自分の Markdown ノートも見てね）。

編集後に保存し、Github Desktop で Commit to main を押し、続けて Push origin をクリックします。

これで https://username.github.io にアクセスすれば自分のサイトが表示されます（しばらく反映に時間がかかることがあります）

独自ドメインの設定

Github Pages 側設定

リポジトリページの Settings → 左側 Pages → Custom domain 欄に独自ドメインを入力し Save。

※同画面で Jekyll テーマも選べます。

DNS 側設定

ドメイン管理パネルにて CNAME レコードを追加し、username.github.io に向けます（username は自分の Github アカウント名）

HTTPS の設定

Github 公式の HTTPS がうまく機能しなかったため、 Cloudflare を使用しました。

Cloudflare の DNS 管理で「プロキシを有効化」し、「SSL/TLS」→「エッジ証明書」→「常時 HTTPS」をオンにします。

他の構築方法

私はブログ用途ではないため、Markdown 1枚の簡易ページで済ませましたが、本格的なブログを作る場合は以下のような静的サイトジェネレータを使うと便利です。

• Jekyll ：Github 公式サポート
• VuePress 日本語
• Gitbook：ドキュメント向き
• LOFFER
• Gridea ：GUI ベースの静的ブログクライアント
• Hexo ：高速・簡潔なブログフレームワーク
• Hugo ：ビルド速度最強クラス

参考リンク

• GitHub Pages クイックスタート - GitHub Docs
• GitHub Pages ブログ：独自ドメイン・HTTPS・CAA
• GitHub Pages 構築チュートリアル
• Git インストール - 廖雪峰の公式サイト