Github Pagesを使った静的ファイル公開を試してみた
静的サイトジェネレーターで作成したコンテンツを公開する先として、NetlifyにするかGithub Pagesにするか迷っています。
Netlifyは使ったことがあったのですが、Github Pagesは使ったことがなかったので、試してみました。
目次
公式ドキュメント
Github Pages概要
Github Pagesを使うにあたって私が気になる点について、公式ドキュメントから抜粋します。
- Github Pagesには、ユーザ、organization、プロジェクトの3種類がある
- 無料アカウントの場合、公開リポジトリでのみGithub Pagesを使うことができる
- Eコマースやオンラインビジネスを提供する目的で使ってはいけない
- GitHub Pages ソースリポジトリは、1GBまで
- GitHub Pages サイトには、100GB/月の制限あり
- GitHub Pages サイトには、10ビルド/1時間の制限あり
その他、詳細についてはこちらをご確認ください。
公開手順
公式ドキュメントに沿って、実際にサイトの公開を試してみます。
リポジトリを作成
今回は「プロジェクト」でGithub Pagesを公開します。
公開用のリポジトリを作成します。
リポジトリにファイルを追加
$ git clone https://github.com/kapiecii/githugpages-test.git $ echo "test page." > index.html $ git add index.html $ git commit -m "add index.html" $ git push
公開設定
リポジトリのSettings画面の下の方にある「Github Pages」の箇所で設定をします。
Github Pagesで利用する公開元を指定します。 今回はmaster branchを指定しました。
Sourceを指定すると、公開URLが表示されます。
Custom domainの設定もここからできるようです。
先程追加したファイルが公開されていました。
テーマの変更
テーマを変更できるようなので、変更してみます。
「Choose a theme」からテーマを選択します。
テーマを選んで「Select theme」をクリックします。
テーマを選択すると、リポジトリのREADMEが更新され、「_config.yml」が追加されていました。
READMEを読むと、Markdownファイルを追加すると、Jekyllでhtmlをビルドしてくれるようです。
Markdownファイルを追加してみます。
$ git pull $ touch test.md $ cat test.md # test markdown file ## aa * bb * cc $ git add test.md $ git commit -m "add test.md" $ git push
テーマが反映された状態でMarkdownファイルの内容が公開されました。
テーマは、Settingから何度でも変更することができます。
最後に
Github Pagesを試してみました。 標準でいくつかのテーマも準備されているので、ちょっとした文章を公開したい場合に使えそうですね。