WordPress を捨てて Hugo に移行した
この記事は書かれてから1年以上が経過しており、最新の情報とは異なる可能性があります
RSS の URL が変わってしまったので、一時的に元の URL に静的な RSS の XML ファイルをおいてますが、 => 置いたけどダメでした・・・ この記事以降の更新は反映されないので、以下より再取得していただければと思います。
http://girigiribauer.com/index.xml
例によって書いてない期間がどんどん開いていきますが、今は管理画面からではなく、Vim から記事を書いているのでだいぶ気分的にラクです。
さて、決して WordPress をディスるわけではないのですが、以下の点を何とかしたいなーと思ってました。
- （たいして書かないのに）管理画面を晒し続けるセキュリティ面でのリスク
- 投稿するまでの心理的障壁
- 設置元サーバの整理
1.は巷でよく言われているのですが、個人ブログで表から見えるところに管理画面を置く必要性がどこまであるのか、最近かなり疑問に思えてきました。 しかも、たいして書かないのにずっとメンテナンスコストはかかるわけですよ。
2.もそれに付随するといえばそうなんですが、当然管理画面が表にあれば、ログインしてから記事を書くことになるわけです。もうなんだかブラウザ開いてログインして記事書いて・・・それすらも面倒になってきたんです。
3.が最後の決定打でした。 設置元のサーバを掃除して CentOS7 に変えつつ、プロビジョニングツールも併せて導入したかったのですが、 この個人ブログの整理をしてどこか別のサーバに退避する必要があり、 一応空きサーバはあったのでそちらにそのまま持って行っても良かったものの、 どうせ整理するなら Github Pages を利用してそっちで公開してもらおう、と思い立ったのでした。
もちろん Github Pages を利用すれば、そちらが落ちれば閲覧できなくなるリスクはあるものの、 めったにないし、あっても別に構わないので Github Pages を利用することに決めました。
上記の1～2から、もう**静的サイトジェネレータ（Static Site Generator）**の何らかを使うことはほぼ決まっていたのですが、 どうせ使うなら Hugo がいいなー Golang がいいなーと思い、WordPress から Hugo への移設を検討し始めました。
移設の条件
あれこれついでにやり始めると、例のごとく終わらずにほったらかしになってしまうので、移設の条件を定めました。
- URL は可能な限りそのまま
- HTML/CSS/JavaSCript は極力いじらない（沼）
- Github ですべて管理
見た目いじらない、重要ですね。 気になるところは色々あれど、見た目やら構造やらをいじり始めるとキリが無いので今回は触りません。
あと必要最低限として URL は変えたくはないので、極力そのままで。
データのエクスポートからローカルでの Hugo まで
こちらの記事がだいぶ参考になりました。
https://mano.xyz/post/2015-09-25-migration-to-hugo-from-wordpress/
エクスポートツールを使うとかなり楽ですね。画像までひっくるめて zip ファイルにまとめてくれます。 URL も基本今までのものを Front Matter に出力してくれるので楽です。
元々 WordPress 時代でも Markdown で大部分の記事を書いていたので、 記事の中身に関してはそれほど困りませんでした。
それとは別に、 Hugo をインストールしてローカル（Mac）で閲覧できるようにします。
brew install hugo
hugo new site bauerlog
cd bauerlog
初期でできるファイル群から必要なものを差し引きして、 大まかに以下のようなファイル構成になっています。
config.toml
content/
static/
themes/
bauerlog/
archetypes/
layouts/
static/
theme.toml
まず全体設定を config.toml に記載しつつ、 記事内容を content/post/ 以下に Markdown で書きつつ、 記事のリソースを static/ 以下に入れ、 それ以外のいわゆる WordPress のテーマに書かれていたような内容は themes/ 以下に 同じくテーマを作って配置しています。
詳しくはこちら https://github.com/girigiribauer/girigiribauer.github.io
自分がよく使うコマンド
新規記事の作成（僕の場合は1日に2件も書かないので日付で）
hugo new post/yyyymmdd.md
全体設定
vi config.toml
記事の編集
vi content/post/yyyymmdd.md
一時的にレンダリング結果を確認（config.toml 内に theme = “bauerlog” などと書いておく）
hugo server
とりあえずここまででローカルで表示確認できるようになりました。
hugo server でローカルで Web サーバが立ち上がるので、
localhost:1313/archives/20160705/ などにアクセスすれば表示確認が可能です。
その他細かい使い方などは、公式を参照するなどしてみてください（https://gohugo.io/）。
Github Pages を用いて公開する
Github Pages を用いて公開する方法は大きく2つあって（これよく間違える）、 1つはユーザー、あるいは組織に紐付いた公開用リポジトリに push する方法で、 もう1つはプロジェクトごとに公開用ブランチを作れる方法です。
前者は、例えばユーザー名が girigiribauer だったとして、 girigiribauer.github.io という Git リポジトリを作り、 master ブランチ に push することでそれがそのまま公開される仕組みになっています。
後者は、Git リポジトリ名は任意なのですが、その中に gh-pages ブランチ を作り、そこにドキュメント類を push することで girigiribauer.github.io/projectname に公開される仕組みになっています。
https://help.github.com/articles/custom-domain-redirects-for-github-pages-sites/
今回は個人用ブログであり、前者の仕組みで問題無いため、 Hugo 関連の設定ファイルやテーマファイルなどを develop ブランチ で管理し、 public ディレクトリにパブリッシュされたものをそのまま master ブランチ に送ることにします。 （最初、勘違いして gh-pages ブランチを作ってしまった・・・）
git subtree を利用したパブリッシュの仕組み
引用多めですがこちらが綺麗にまとまってますので、参考にさせてもらいました。
http://www.kotazi.com/blog/post/2015111301/
まず girigiribauer.github.io の develop ブランチに Hugo 関連のファイル一式を git add します。
一方で master ブランチに何も入ってないと git subtree add できないので、.gitkeep あたりでも突っ込んでおきます。
git checkout master
touch .gitkeep
git add .gitkeep
git commit
git push origin master
develop ブランチ上に public ディレクトリがもしあれば削除したうえで、 git subtree add します。
git checkout develop
rm -rf public
git subtree add --prefix=public git@github.com:girigiribauer/girigiribauer.github.io.git master --squash
git subtree pull --prefix=public git@github.com:girigiribauer/girigiribauer.github.io.git master
hugo コマンドで実際に配置するファイルを生成して commit します。
hugo
git add public/
git commit
あとは git subtree push で master ブランチへ反映します。
git subtree push --prefix=public git@github.com:girigiribauer/girigiribauer.github.io.git master
一応ここまでやれば、 girigiribauer.github.io には反映がされてるはずです。
独自ドメインの設定
URL を変えたくなかったので、 static/CNAME にドメイン（girigiribauer.com）だけ書かれたファイルを追加し、 外から DNS の設定をしています。
Github Pages の IP アドレスはどうやら 192.30.252.153 と 192.30.252.154 のようですね。 （https://help.github.com/articles/troubleshooting-custom-domains/#dns-record-doesnt-point-to-githubs-server） なので、元々のさくらVPSの IP アドレスから 192.30.252.153 に変更して、Github Pages の方に向いたことを確認できました。
まとめ
元の条件としては、だいたいクリアできました。
- URL は可能な限りそのまま
- HTML/CSS/JavaSCript は極力いじらない
- Github ですべて管理
ただ、いくつか課題も残っています。
- RSS の URL
- 画像のリサイズ
- （タグ一覧ページが想定されてない、移設前の問題）
大抵のものは、割り切ってしまえばなんとかなるんですが（というか気にしないことにしてしまえばOK）、 画像のリサイズとかは管理画面がない分、なんとかしないといけなさそうです。
RSS の URL は、Hugo 側で一覧ページごとに生成されるらしく、 ファイル名は変更できるものの、細かいカスタマイズは難しいようです。（詳しく調べてない） とはいえ定期購読してる人なんて皆無だろうし、 ここも割り切ってしまえばいいかという感じで済ませてしまおうかと考えてます。 （Github Pages だけでリダイレクトの仕組みは提供されてないっぽいですかね・・・？）
RSS 登録してる稀有な方、URL 変わっちゃってすみません・・・。メタタグの URL 変えとけばいいんでしたっけ？
参考 URL
この記事は書かれてから1年以上が経過しており、最新の情報とは異なる可能性があります