Wantedly開発チームブログの書き方

(※この記事はWantedlyのエンジニアメンバー向けのサンプル記事です)

こんにちは！

このブログはMiddlemanを使って生成され、GitHub Pages上にホストされています。 MiddlemanはRubyで書かれた静的サイト生成のフレームワークで、gemとして提供されています。

記事を書くには

手元の環境で動かすには以下のようにします。

初回はまずレポジトリをcloneしてとってきましょう。ちなみに、developブランチに元原稿が存在し、masterブランチに公開するHTMLが自動的に生成されます。

$ git clone git@github.com:wantedly/wantedly.github.io.git
$ cd wantedly.github.io
$ git checkout develop
$ bundle install
$ bundle exec middleman server
$ open http://localhost:4567/

2回目以降は、手元のdevelopブランチを最新にするだけです。

$ git pull origin develop
$ bundle exec middleman server
$ open http://localhost:4567/

新しい記事を書くには、以下のように過去の記事ファイルをコピーするのが簡単です。 live reload機能が有効になっているので、原稿の.mdファイルを更新するだけで、自動的にブラウザ側も再読込されます。middleman-livereloadというgemの機能です。

$ cp source/2013-12-07-hello-world.html.md source/YYYY-MM-DD-TITLE.html.md

適当にbranchを作ってpull requestを送ってください。

原稿はMarkdown形式で書きます。画像を使ったり、Wantedlyで使われている各種プログラミング言語のsyntax highlightも出来ます。Markdownのレンダリングにはredcarpet、syntax highlightにはmiddleman-syntax gemを使っています。

Ruby

def my_cool_method(message)
  puts message
end

CoffeeScript

$ ->
  console.log 'hi'

SELECT COUNT(*) FROM users

記事を公開するには

以下のようにすると、HTMLファイルが生成されGitHubのmasterブランチにgit pushされて、自動的に公開されます。middleman-deploy gemの機能です。

$ bundle exec middleman deploy

簡単！

Wantedly Engineer Blog