Hugoのインストールから自動デプロイまで

Feb 28, 2015 · 2 minute read hugo wercker memo

このブログを作るにあたって行ったことのメモ

ブログ構成

エンジン : Hugo
ホスティングサービス : GitHub Page
CIサービス : Wercker

流れ

基本的にはHugoのドキュメント通り. 自動デプロイに関してもAutomated deployments通り.

Hugoのインストール

GitHubのリポジトリから直接入手

$ go get -v github.com/spf13/hugo

Macの場合はbrewでインストール可能

$ brew install hugo

ブログを作成

本体の作成

$ hugo new site blog.motomizuki

以下はblog.motomizuki内での作業

コンテンツの作成

$ hugo new about.md

記事の作成

$ hugo new post/title.md

Markdownの基本テンプレートはarchetypes内のdefault.mdが適用される

ブログにテーマ(hyde-x)を適用

$ mkdir themes
$ cd themes
$ git clone https://github.com/zyro/hyde-x
$ hugo -t hyde-x

ブログのpreview

$ hugo server --theme=ThemaName --buildDraft
2 pages created
0 tags created
0 categories created
in 5 ms
Serving pages from exampleHugoSite/public
Web Server is available at http://localhost:1313
Press Ctrl+C to stop

ビルドで使用するテーマをThemaNameで設定

ブログを編集しながら確認したい場合は--watchを付ける

$ hugo server --theme=ThemaName --buildDrafts --watch
2 pages created
0 tags created
0 categories created
in 5 ms
Watching for changes in exampleHugoSite/content
Serving pages from exampleHugoSite/public
Web Server is available at http://localhost:1313
Press Ctrl+C to stop

WerckerでGitHub Pagesへ自動デプロイ

Werckerを使い，ブログソースをgit pushしたら GitHub Pages(https://username.github.io)に自動デプロイするようにする．

gitの設定

$ git init

自動デプロイの際にpublicディレクトリが自動生成されるので, 既存のpublicはgitで管理しない.

$ echo "/public" >> .gitignore

空のディレクトリがあるとWerckerに警告されるので，staticディレクトリ内にとりあえずrbots.txtを置いておく．

echo "User-agent: *\nDisallow:" > static/robots.txt

GitHubのプロジェクトに追加

git add .
git commit -m "Initial commit"
git remote add origin git@github.com:motomizuki/blog.motomizuki.git
git push -u origin master

GitHub Pages用リポジトリを用意

username.github.ioというリポジトリを作成.

Werckerの設定

WerckerのアカウントをREGISTER USING GITHUBから作成. APPを作成し必要な項目を埋ていく，Configure accessではwithout using an SSHを選択する. APPのビルド，デプロイ設定をWercker.ymlで記述し, リポジトリ(blog.motomizuki)に追加する.

box: wercker/default
build:
    steps:
        - arjen/hugo-build@1.0.2:
            theme: hyde-x
            flags: --buildDrafts=true
deploy:
    steps:
        - lukevivier/gh-pages@0.2.1:
            token: $GIT_TOKEN
            basedir: public
            repo: motomizuki/motomizuki.github.io

インデントは半角スペース4つで！ repoでデプロイ先のリポジトリを設定しないと上手く動かなかった. ビルド, デプロイも成功となるが，実際にリポジトリは更新されないという状況.

APPの設定

SettingのDEPLOY TARGETSをcustomに． Add new variableでnameをGIT_TOKEN, valueはGitHubのPersonal access tokensでgenerateできる文字列にして登録．

終わり

ここまで設定すると記事を書いてソースをpushすると自動でデプロイされる．