静的サイトジェネレータ
新しくブログを作るにあたって、静的サイトジェネレータなるものを使うことにした。jekyllはいろんな人が使ってるし、1番有名な気がしてる。
他には、middlemanも日本語の情報が多くて良さそう。
でも、なんとなくgemに頼りたくなかったので（普段Sass使ってるけど）、rootsというものを使った。
roots
rootsはnode製の静的サイトジェネレーター。
公式サイト: roots | where it all begins
npmでインストールできる。
$ npm install -g roots
npmが入っていない人はここからnode.jsをインストールする。
$ roots new project-name
でプロジェクトのテンプレートを作成できる。
ブログのテンプレートは
$ roots new blog-name --blog
で、作成。
rootsは、デフォルトでJade、Stylus、CoffeeScriptが使える。ファイルのコンパイルは
$ roots compile
Jade, Stylus, CoffeeScriptをコンパイルして/publicに出力される。ついでに、HTML, CSS, JavaScriptのMinifyもしてくれる。また、
$ roots watch
で、ファイルを監視して保存時に自動的にコンパイルできる。ローカルサーバーがデフォルトでポート1111番で起動する。watchではMinifyはされない。watchしてると、保存時に自動でブラウザがリロードするのが気持ちいい。
他にも、heroku toolbeltをインストールしていると、
$ roots deploy
で、一発でherokuにデプロイできる。
また、rootsでは、axisというStylusのMixin集が使える。normalize.cssをインクルードできたり、gridも設定できる。
grid()
column-width = 60px
gutter-width = 20px
columns = 12
total-width = 100%
.main
column(9)
.sidebar
column(3)
columnsでgridの分割数を設定して、column()で使える。他にも、ベンダープレフィックスが自動で付けれたり、ボタンとか通知とかのUIパーツもある。
rootsは、公式サイトにチュートリアル動画のリンクがあるので、見てみるといいかも。
最後に
rootsを使ってブログを作った。簡単なサイトを作るのにはすごく便利で、どれか使えるようにしておくといい気がする。
WordpressのようなCMSとは違い、シンプルでカスタマイズしやすかった。