WordPressからGitHub Pages+Middleman+Travis CIに移行したらブログを書く気になれた話

Blog #blogadvent Advent Calendar 2013 17日目の記事です。

かつて、WordPressでブログを運営していましたが、GitHub Pages+Middleman(日本語)+Travis CIに移行してみたら捗るようになったので、その移行話を書いてみます。

(ちなみに移行先のリポジトリはこれです)

なぜ移行したか

移行した理由ですが、簡潔に言うと「記事を公開するまでの流れを楽にしたかった」ということです。そして実際に移行したことによるメリットが2つあります。

1つめは、記事公開するまでの手順を減らせたことです。例えばWordPressの場合、普段使っているエディタで記事を書いた場合、以下の5つの手間が発生してとても面倒くさいものでした。

  1. 記事をエディタで書く
  2. ブラウザでWordPressのダッシュボードを開く
  3. 投稿から新規追加を押す
  4. タイトルと本文、タグなどにそれぞれ書いた内容をコピペしたり、スラッグを決める
  5. 公開ボタンを押す

しかしmiddlemanに移行後、手順が以下の通り2つ減り、よりブログの記事を書こうという気になっています。

  1. 記事をエディタで書く
  2. ターミナルやGitをGUIで扱えるソフト(SourceTree)などを開く
  3. git add . && git commit && git push origin master

2つめは、普段使っているエディタとmarkdown形式が使えるようになったということです。markdown形式については、Markdown on SaveというWordPressのプラグインを使っていましたが、プラグインを追加しなくても標準で対応しているというのが良いと思いました。

とはいえメリットだけでなく、GitHub Pages+Middleman+Travis CIの連携がちょっと面倒というデメリットはあります(参考までに、下記の移行までの流れの章で移行にあたって参考にしたサイトを載せています)。

とはいえそれも最初だけで、ブログを書いて公開する時間のほうが移行する準備の時間より長いので、元は取れるかなという感じです。

移行までの流れ

MiddlemanのインストールとTravis CIで自動ビルドとGitHubへ自動的にpushする流れを作るのに、Middleman で作った web サイトを Travis + GitHub pages でお手軽に運用する - tricknotesのぼうけんのしょを参考にしました。

Middlemanの設定については、@hokacchaのブログ、Webtech Walkerリポジトリを見て参考にしています。

上の2つのリンクと公式サイトのMiddleman Basicsのリンク先を見れば、インストールから設定まで事足りますが、リンクだけ紹介するのも芸がないので、移行にあたり工夫した点を以下に書いていきます。

テンプレートファイルをSlimにした

ERB形式のテンプレートファイルの場合、Rubyをテンプレートファイルの中に組み込みたいという場合に<% ... %>みたいな感じで、いちいち<>や%を書かないといけなかったり、HTMLの要素を書くときにも<と>を打たないといけないというのが面倒だと感じました(HTMLに関してはEmmetを使えばいい話ですが)。

なので、Slim形式にテンプレートを書き換え、config.rbで以下の2行を追記し、Slimを使うようにしています。

set :markdown, :layout_engine => :slim
set :blog_layout_engine, :slim

URLにyyyy/mm/ddの形式で年月日を含めるようにした

Middleman固有の話ではないのですが、URLに年月日を含めるようにしました。というのもこのブログで扱うのがWebの技術に関することという以上、更新しない限り情報は古くなります。

そうなった場合、例えば情報を探している人が検索エンジンなどから自分が書いた古くなった情報が載っている記事にアクセスして、かつその情報を参考にしてしまった場合、その時点で正しくない情報に誘導(して|されて)しまったということでお互いもやっとした気持ちになると思います。

なので、そういうことが減るようURLに年月日を含めることで、もしかしたらこの情報は古いかもしれないという事に気づいてくれたらという期待をこめて、URLに年月日を含めるようにしました。


ということで、WordPressからMiddlemanに移行したらブログを書く気になれた話でした。これからもここで記事を書けるよう技術的に精進していきたいと思います。