top / index / prev / next / target / source

2017-02-14 diary: [github] で [gh-pages] を使って静的 web サイトを公開するときの基本手順(最新版)

いがぴょん画像(小) 日記形式でつづる いがぴょんコラム ウェブページです。

[github] で [gh-pages] を使って静的 web サイトを公開するときの基本手順(最新版)

github では gh-pages という機能を使うと 静的 web サイトを公開することが可能になります。 ここでは、最近リリースされた最新で簡易な手順をメモします。

まず、この文書は github アカウントを既に取得済みであることを前提にします。ここでは igapyon というアカウントを持っていることを前提に記載します。また、gh-pages には幾つかの設定方法がありますが、master ブランチをそのまま利用する公開方法を示します。

ここでは以下のような順序で web 公開設定を実施することとします。

静的 web 公開用リポジトリの作成

新規に静的web公開用のリポジトリの作成します。web ブラウザで github サイトを開きます。

github にログインして、Start a project ボタンをクリックするか、あるいは Your profile を開いてから Repositories タブを開いて New ボタンをクリックします。

Select repository tab

新規リポジトリ作成詳細画面で Repository name にリポジトリ名などを入力します。

Create new repository detail

日記を公開することを想定するならば、リポジトリ名は `diary` や `blog` などの名称にすることを推奨します。

Add .gitignore をクリックして、検索テキストボックスに maven と入力してから Maven を選択します。

Add maven ignore

ここで .gitignore を生成することにより有効になる後続手順があることに注意してください。

Create repository ボタンをクリックします。

Create new repository

これでリポジトリ作成が完了します。

参考:ここで作成された github リポジトリは以下のような形式で表現することができるものです。

https://github.com/`AccountName`/`RepositoryName`.git

作成したリポジトリの master ブランチを 静的 web として公開

次に、いま作成したリポジトリの master ブランチを静的 web として公開します。

Settings タブを開きます。

Open Settings tab

GitHub Pages セクションを探します。

GitHub Pages

SourceNone をクリックしてドロップダウンから master branch を選択します。

Select master branch

Save をクリックして Source 設定の変更を保存します。

Save source

Sourcemaster branch に変更済であることを確認します。

Confirm source

まとめ

ここまでの手順が終われば、これ以降の静的 web リポジトリの gh-pages ブランチへのコミット&プッシュ内容が github の静的 web として公開されるようになりました。

ちなみに、上記のような手順で作成すると、以下のような URL で web 公開されます。

https://`AccountName`.github.io/`RepositoryName`/

なお、この手順をには web コンテンツ作成は含まれていないので、そのままではコンテンツが存在しません。開こうとすると 404 エラーになります。 エラーにしないためにはコンテンツを作成する必要があります。markdown (.md) ファイルなどをコミット&プッシュして、コンテンツを公開していきましょう。

関連するコンテンツ

Last modified: $Date: 2017-02-23 $

登場キーワード


この日記について