GitHub PagesによるWeb公開

**GitHub Pages（ギットハブ・ページズ）**は、GitHubが提供する無料のホスティングサービスで、リポジトリ内のHTMLやMarkdownファイルを元に静的Webサイトを公開できます。これにより、ポートフォリオ、プロジェクトのドキュメント、ブログなどを簡単にWeb上に公開できます。

1. GitHub Pagesの特徴

  • 静的サイト専用（HTML, CSS, JavaScript）

  • 無料でHTTPS対応

  • カスタムドメインの利用可能

  • Jekyllによる自動ビルド対応

2. 公開方法の種類

GitHub Pagesには以下の2種類の公開方法があります：

  1. ユーザーまたは組織サイト（User/Organization Site）

    • リポジトリ名：<username>.github.io

    • 例：https://yourname.github.io

    • main または master ブランチのルートが対象

  2. プロジェクトサイト（Project Site）

    • 任意のリポジトリで可能

    • 通常はgh-pagesブランチ、または特定のディレクトリ（例：/docs）を使用

3. 基本的な公開手順（プロジェクトサイトの例）

ステップ1：リポジトリの作成

GitHubで新しいリポジトリを作成します（例：my-website）。

ステップ2：HTMLファイルの配置

ローカルにHTML/CSSファイルを作成し、Gitを使ってリポジトリにコミット・プッシュします。

bash
git init
git add .
git commit -m "initial commit"
git branch -M main
git remote add origin https://github.com/yourname/my-website.git
git push -u origin main

ステップ3：GitHub Pagesの設定

  1. GitHubのリポジトリページにアクセス

  2. 「Settings」 > 「Pages」を開く

  3. 「Source」から公開元（例：mainブランチの/docsフォルダなど）を選択

  4. 「Save」をクリック

ステップ4：公開URLを確認

設定が完了すると、https://yourname.github.io/my-website/ などのURLで数分以内にサイトが公開されます。

4. Jekyllを使った高度なカスタマイズ

GitHub Pagesは静的サイトジェネレーター「Jekyll」に対応しており、MarkdownファイルをHTMLに変換して公開することも可能です。_config.yml や _layouts、_posts フォルダなどを使ってテンプレートやブログ形式のページが作成できます。

5. カスタムドメインの設定（任意）

独自ドメインを使用する場合：

  1. ドメインのDNS設定にAレコードやCNAMEを追加

  2. GitHub Pagesの「Custom domain」に設定するドメイン名を入力

  3. 「Enforce HTTPS」を有効にする（可能であれば）

6. 主な注意点

  • サーバーサイド言語（PHP、Pythonなど）は使用できません

  • コンテンツの更新にはGitHubへのコミットが必要

  • 公開には少し時間がかかる場合があります

まとめ

GitHub Pagesは、バージョン管理された静的コンテンツをすぐにWebに公開できる非常に便利な機能です。学習目的でも、実運用のドキュメントやポートフォリオの公開にも利用価値が高く、GitHubを使う開発者にとって習得しておくべき技術の一つです。

生成日：2025/06/09