目的

GitHub Pagesのプロジェクトページに静的ページを配置する．
端的にコマンドを実行し続けるだけで生成できるようにする．

準備

Hugoのインストール

brew install hugo

Hugoを用いてサイトを生成する

下記のコマンドでsiteを一発で生成する事が出来る．
今回はtestpageという名前のsiteを生成する．

hugo new site testpage
cd testpage

Hugoのテーマをインストール

まずはテーマ適用のためにディレクトリを作成する．
作製位置は，testpageのすぐ下になる．

mkdir themes
cd themes

次に，Installしたいテーマを決めてcloneする．
今回はhugo-base-themeというテーマを利用したため，以下のようなコマンドになる．

git clone https://github.com/crakjie/hugo-base-theme.git hugo-base-theme

# もし任意のテーマをインストールする場合は，
# git clone https://github.com/[username]/[userproject].git [userproject]
# と実行する事で，themesの下に [userproject]という名前のテーマのディレクトリが生成できる．

Hugoのテーマを適用させる

テーマを適用させるには，

# testpageディレクトリに戻り
cd ..

# テーマを適用
hugo -t hugo-base-theme

上記のコマンドで実行可能

サーバを建ててテーマが適用されているか確認

hugo server -t hugo-base-theme

Github にProjectリポジトリを作成する

Githubリポジトリを作製

これは各自でお願いします．
私は同名のtestpageというディレクトリを生成しました．

config.tomlを編集する

terminal内のtestpage配下に存在するconfig.tomlを編集します．
以下のサイトを参考にしました．
Hugo Part 2 - Hugo で github にブログを立ち上げる

config.toml


title = "My New Hugo Site"
baseurl = "http://shopetan.github.io/testpage"
languageCode = "ja-jp"
theme = "hugo-base-theme"　# part 1 で選んだ theme を設定する
canonifyurls = true # 相対パスではなく baseurl を基点とした絶対パスにする

[params]
  description = "This is yourblog"
    author = "your name"

[taxonomies]
  category = "categories"
    tag = "tags"

Git管理を開始する

Github側で何かREADME.mdファイルなどを追加していた場合は以下のようにしてgit pullしておきます．

git init
git remote add origin git@github.com:shopetan/testpage.git
git pull origin master

次に，現在存在している publicディレクトリは削除します．

rm -rf public

後はいつも通り

git add .
git commit -m "First commit"
git push origin master

でOKです．

公開準備

Github pagesで公開する為には，gh-pagesというブランチを新たに作成し，index.htmlを含めている必要があります．

まずはgh-pagesにブランチを切り，

# --prphanオプションを付ける事で，他のブランチと独立して管理
git checkout --orphan gh-pages

既存の管理していたファイルを除外する．

git rm -f --cached $(git ls-files)

とりあえず，適当にREADME.mdファイルを追加して反映させる．

echo "# testpage" >> README.md
git add README.md
git commit -m "Initial commit on gh-pages branch"
git push origin gh-pages

masterブランチに戻り，公開準備．
gh-pagesをsubtree化することで，masterブランチにgh-pagesで変更したpublicの内容を反映させる事ができる．

git checkout master
git subtree add --prefix=public git@github.com:shopetan/testpage.git gh-pages --squash
git subtree pull --prefix=public git@github.com:shopetan/testpage.git gh-pages

実際にデプロイを行う．

ここまで出来たら簡単で，後は何か変更を加えるたびに以下のコマンドを入力するだけでOKになる．

# testpageディレクトリから，以下のコマンドを打つだけ

hugo -t hugo-base-theme
git add .
git commit -m "Updating site"
git push origin master
git subtree push --prefix=public git@github.com:shopetan/testpage.git gh-pages