始めるにあたって
twitterはほぼゲーム垢だし、 facebookは記録として残すようなイメージでも無いので、 個人的な技術メモ的な内容でブログを復活させてみようかと思い、物色。
各種ホスティングサービスも考えたけど、 広告とか広告とか広告なんかは少々ウザいし、 お金払うのも勿体無い。
とゆー経緯で探してみると、GitHubのPagesを使って静的ブログを運営する記事がちらほら。
どうせ記事執筆はPCからだろうし、 マシンスペック的にも複雑なjavascriptを使った管理サイトより、 エディタでmarkdown記述&CLIで運用できる仕組みは、 私（のロースペックPC）にはピッタリなので、これに決めた。
次は静的サイトジェネレータ選び。 記事生成の速さとgolangのプロジェクトであるという観点からHugoに決定。
Hugoのインストール
私のマシンはWindowsなので、 Hugoのリリース一覧 より hugo_0.14_windows_amd64.zip をダウンロード。
アーカイブの中を覗いてみると
hugo_0.14_windows_amd64.exe
license.md
readme.md
の3つのみ。至ってシンプル。
これを、C:\Hugo あたりに展開し、 exe ファイルを hugo.exe という名前で複製してからPATHを通しておく。
> hugo version
Hugo Static Site Generator v0.14 BuildDate: 2015-05-26T01:29:16+09:00
ok.
作業ディレクトリの作成からサイト生成
ブログ用の作業ディレクトリを作成して初期サイト生成。 私はDropBox上に作った。
> cd [work_dir]
> hugo new site spec-R
> cd spec-R
> tree
フォルダー パスの一覧: ボリューム Windows7_OS
ボリューム シリアル番号は 00000200 8A06:F800 です
C:.
├─archetypes
├─content
├─data
├─layouts
└─static
new site しても無言だったので、最初何が起こったのか分からなかったｗ
テーマの設定とローカルサーバ稼働確認
公式では、以下のコマンドで全部のテーマをインストールし、 あとから不要なものを削除するとか書いてある。
> git clone --recursive https://github.com/spf13/hugoThemes.git themes
私はシンプルでステキなtanksuzukiさんの angels-ladderというテーマを 少々カスタマイズして利用させてもらい、 慣れてきたら後で自作することにする。
> md themes
> cd themes
> git clone https://github.com/tanksuzuki/angels-ladder angels-ladder
> cd ..
> hugo server -D -w -t angels-ladder -d .\draft
...
Serving pages from ...\spec-R\draft
Web Server is available at http://127.0.0.1:1313/
Press Ctrl+C to stop
-d の指定はジェネレータの出力ディレクトリ。 デフォルトだと.\publicにできるのだけど、 リリース時に下書き（draft）を消してくれないので、 下書きとリリースのディレクトリを分けておく。
ブラウザでhttp://localhost:1313/を確認。 無事稼働。
テーマの設定&カスタマイズ
テーマの設定はブログのルートディレクトリに config.toml というファイルを作成して記述する。 内容はConfigurationからコピペ&修正。
baseurl = "http://rugger-sr.github.io/"
languageCode = "ja-JP"
title = "spec-R"
disqusShortname = "らが～"
[Params]
subtitle = "らが～の備忘録。"
facebook = "https://facebook.com/kouji.sekine"
twitter = "https://twitter.com/emi303"
github = "https://github.com/rugger.sr"
profile = "/images/profile.png"
copyright = "Written by らが～"
[Permalinks]
post = "/blog/:year/:month/:day/:slug/"
特筆することは無いけれど、 permalinkは /blog/年/月/日/slug/ と変更し、 ./static/images/profile.png に自分のアイコンをコピーしておく。
また、このテーマはコードハイライトにhighlight.jsを利用しているので、 jsの指定をCDNに切り替え、 加えてgistを貼った時との親和性ｗからstyleをgithub-gistに変更しておく。
---- ...\themes\angels-ladder\layouts\partials\header.html ----
- <link rel="stylesheet" href="/css/highlight_monokai.css">
+ <link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.8.0/styles/github-gist.min.css">
---- ...\themes\angels-ladder\layouts\partials\footer.html ----
- <script src="/js/highlight.pack.js"></script>
+ <script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/8.8.0/highlight.min.js"></script> <link rel="stylesheet" href="/css/theme.css">
記事作成
まず、記事投稿時の初期markdownテンプレートを定義できるらしいので、 .\archetypes\default.md というファイルを作成し、 以下のようにしておく
+++
date = "now()"
draft = true
slug = ""
tags = ["", ""]
title = ""
+++
そして記事を生成し、内容を更新する。
> hugo new post\2015-09-13_Hugo.md
(記事を記述)
> type .\content\post\2015-09-13_Hugo.md
+++
title = "GitHub Pages + Hugo でブログ"
date = "2015-09-13"
draft = true
slug = "Hugo"
tags = ["Hugo", "Github"]
+++
## 始めるにあたって
(以下内容)
そしてdraftサーバで確認する。
> hugo server -w -D -t angels-ladder -d .\draft
ok.
gitリポジトリの作成とGitHubへのpush
まずブログ環境と記事md関連管理用のgitリポジトリを作成
> git init
> type CON > .gitignore
draft/
public/
.*.swp
.*.un~
^Z
> git add -A
> git commit -m "spec-R initial contents"
こいつは、ローカル管理で良い（DropBox使えば安心？）。
次に、公開向けファイル生成し、こちらをGitHub Pagesにpushできるようにする。
> hugo -t angels-ladder -d .\public
> cd public
> git init
> git add -A
> git commit -m "spec-R GitHub Pages initial contents"
GitHubに rugger-sr.github.io という名称でリポジトリを作成し、 publicリポジトリのremoteに設定。
> git remote add origin https://github.com/rugger-sr/rugger-sr.github.io.git
> git push origin master
ブラウザで http://rugger-sr.github.io/ を確認…あれ？記事が表示されない…。
そりゃ下書きですもんｗ
運用バッチファイルを作成
以下の様な3つのバッチファイルを作成
h_draft_server.bat
下書きを有効（-D）にしたドラフトサーバを起動する。 コンテンツ（*.md）の更新などもすぐに反映される（-w）ので便利。 生成される静的ファイルは、公開用と間違えないように .\draftディレクトリ以下に生成（-d）している。 起動するWEBサーバのポートは1313固定みたいだ。
@echo '#### Hugo Draft Server : spec-R ####'
@start hugo server -D -w -t angels-ladder -d .\draft
h_production_server.bat
下書きを無効にしたローカルサーバを起動する。 基本的にはdraftと同じだが、出力ディレクトリを .\public とする。
@echo '#### Hugo Production Server : spec-R ####'
@start hugo server -w -t angels-ladder -d .\public
h_publish.bat
コンテンツをビルドし、更新された内容をGitHubにpushするバッチ。
@echo off
echo '#### Hugo publish : spec-R ####'
hugo -t angels-ladder -d .\public
cd public
git add -A
git commit -m "site publish"
git push
echo 'Site Published.'
echo on
ここまで作ったら、先のmd冒頭にある draft を false に設定して h_publish.bat を実行する。
んで、完成。
今後とも、よろしくお願いします。