GitHub Pagesで無料ブログを作成する - Part1 GitHubにリポジトリを作ってサイトを公開する

画像出典：GitHub Pagesのサイトよりスクリーンショット

以前、 GitHub Pagesでブログを運用し始めてから4年くらいたったというブログを書いたのですが、概要を書いただけで具体的な構築方法はあまり記述していなかったので、何回かに分けてブログを作っていく方法を書いていきたいと思います。

基本的には GitHubのヘルプページを読むのが確実です。

掲載予定

1. GitHub Pagesについて知る

GitHub PagesはGitHubにリポジトリを作りそこにサイト用のファイルを配置することで、Webサイトとして運用できる仕組みです。 GitHub Pagesのサイトには個人のユーザーであればユーザーサイトか、プロジェクトのサイトがあります。

ユーザーサイトは username.github.io (usernameのところは自分のGitHubユーザー名に置き換える)というリポジトリを作成する必要があります。 username.github.io リポジトリの master ブランチに配置されたファイルがWebサイトとして公開されます。その場合のurlはhttps://username.github.ioになります（設定次第でカスタムドメインを使うことも可能です）。

プロジェクトサイトは特にリポジトリ名にルールはなく、普段作成しているリポジトリで管理できます。urlはhttps://username.github.io/project(projectの部分がリポジトリ名に置き換わる)という形になります。 ただしプロジェクトサイトではmasterブランチが公開されるのではなく、gh-pagesブランチが公開されます。

主に個人の情報を公開したりブログを作ったりする場合は、username.github.ioのユーザーサイト、自分が作っているOSSのようなプロジェクトについての情報を公開する場合はプロジェクトサイトを使う、という形で使い分けていけばいいと思います。

ここではユーザーサイトをサンプルに作ってみます。

2. GitHubにリポジトリを作る

ではGitHubに実際にリポジトリを作ってみましょう。

GitHubの右上のナビゲーションバーのプラスボタンからNew repositoryを選びます。

New repository

Repository Nameのところに、username.github.ioを入力します。私の場合はすでに作成済なのでエラーになります。

username.github.io

Initialize this repository with a README のチェックはどちらでも大丈夫です。

これでリポジトリの作成ができました。

3. リポジトリにファイルを作って公開する

リポジトリが作成されたらすでに公開準備は整っているので、ファイルを追加してサイトを公開します。

まずリポジトリをクローンします。

$ git clone https://github.com/username/usernam.github.io.git

そしてindex.mdというファイルを作成して適当に中身を書きます。

index.md

Hello world

これをリポジトリに追加してGitHubにプッシュします。

$ git add index.md
$ git commit -m "first commit"
$ git push

これでhttps://username.github.ioにアクセスすると、Hello worldと表示されると思います。

hello world

以上でサイトの公開ができました。

4. 設置を確認する

リポジトリのナビゲーションメニューのSettingに移動するとGitHug Pagesの設定を確認することができます。

settings

設定の中にEnforce HTTPSという項目があるので、このチェックをオンにしておくことをお勧めします。

Enforce HTTPS

以上で無事サイトを公開することができました。

次のPart2ではJekyllというツールを使って、ブログ形式のサイトを構築する方法を書いていきます。

エンジニアリング GitHub Pages ブログ

関連記事