GitHub Pages を作ってみた

なんとなく GitHub Pages を作ってみたので、備忘録としてメモを作成。

スポンサーリンク

はじめに

GitHub Pages はすでに世の中的にそこら中で使われているので説明不要だと思うが、簡単に言えば以下のような特徴のあるサービスです。

  • GitHub アカウントを作ることで GitHub Pages も作成可能。いずれも無料
  • 容量は1GBまで
  • 帯域制限もあるが、通常のサイトであれば問題ないレベル
  • GitHub上のリポジトリと連動しているので、GitHubに慣れている人ならデプロイが非常に簡単で扱いやすい
  • HTML/CSS/JS/画像などの静的ファイルのみ設置可能なので、PHPなどのいわゆる動的コンテンツは機能しない
  • https にも対応
  • ドメインを持っていれば独自ドメインにも対応

ファイルサイズは気になるけども、静的ファイルベースのサイトなら最強レベルだと思います。
とりあえず、GitHub Pages 使えばいいんじゃね?という感じですね。

作成手順

自分が実際に実施した手順です。

リポジトリ作成

まずは、GitHub Pages 用のリポジトリを作成します。
GitHub Pages にはいくつかの作り方があるようなのですが、[ユーザー名].github.io という名称でリポジトリを作ると、https://[ユーザー名].github.io/ という URL の GitHub Pages を作ることができるので、まずはこの名称のリポジトリを新規に作成します。

ちなみに、違う名前でリポジトリを作った場合には、例えば xxxxx という名称の場合は、https://[ユーザー名].github.io/xxxxx/ という URL になります。

なお、GitHub Pages は public リポジトリである必要があります。

ページ作成

作成したリポジトリで適当にページを作成します。
GitHub 上で作成してもいいし、普通に clone してローカルで add, commit して、push でもいいです。

GitHub Pages 有効化

ここまでで準備はできたので、右上の Settings メニューから GitHub Pages を有効化します。
すると、この時点で https://[ユーザー名].github.io/ でページが表示されるようになりますので、確認します。

独自ドメイン

ここまででも十分なのですが、ドメインを持っている場合には、さらに独自ドメイン対応することができます。

該当ドメインの設定画面にて、設定したい独自ドメインの CNAME を 上記で設定した GitHub Pages のドメインに設定します。
例えば、GitHub のユーザー名が user1、設定したい独自ドメインが www2.mydomain.com の場合には、www2.mydomain.com の CNAME を user1.github.io に設定します。

DNS は伝播するまでに時間がかかることがあるので、設定後しばらく様子を見ます。

dig 等で伝播が確認できたら、再度 Settings の GitHub Pages の画面で Custom Domain を設定します。
私の場合は、DNS の伝播がうまくいっていなかったようでなんだかんだで15分くらいエラーが出ていたので、場合によっては時間がかかることもありそうです。

また、その下にある “Enforce HTTPS” の設定にチェックを入れると、独自ドメインでも https に対応できます。

すべて設定が終わったら、設定したい独自ドメイン(例だと www2.mydomain.com)でアクセスしてみます。
なお、独自ドメイン設定前に有効だった github.io ドメインの URL(例だと user1.github.io)は、独自ドメイン設定後は独自ドメインにリダイレクトされるようになります。

コメント

タイトルとURLをコピーしました