静的サイトジェネレーターのRootsを素振りする

Roots?

Node.js製の静的サイトジェネレーターです。
知り合いに教えていただいたので素振りしてみました。

プロジェクトの新規作成

http://roots.cx/articles/getting-started
を見ながら流れに沿ってやってみる。

$ roots new roots-sandbox
? Your project's name: roots-sandbox
? A brief description of your project: roots sandbox
▸ project created
▸ dependencies installing
.
.
▸ dependencies finished installing
▸ project initialized at /Users/dkimura/sandbox/roots-sandbox
▸ using template: roots-base
✓ done!

プロジェクトの雛形 + 必要なnpmをインストールして完了。

作成されるディレクトリ/ファイル

基本的には、Jade, Stylus, CoffeeScriptの構成になるっぽい。

├── app.coffee - 開発環境用の設定ファイル
├── app.production.coffee - 本番環境用の設定ファイル
├── assets
│   ├── css
│   │   ├── _settings.styl
│   │   └── master.styl
│   ├── img
│   └── js
│       └── main.coffee
├── node_modules
├── package.json
├── readme.md
└── views
    ├── index.jade
    └── layout.jade

用意されているコマンド

とりあえず、基本的なコマンドだけ使ってみる。
これ以外のコマンドは、roots --helpで確認できます。

compile

public ディレクトリに静的ファイルを生成してくれる。

$ roots compile
compiling... done!

watch

http://localhost:1111/でローカルサーバーが起動する。

$ roots watch
compiling... done!

浅く触った/見た感想

  • ドキュメント見やすくて好き。
    • Stylus to SCSSも見る限りは容易…?
    • Extensionも最低限のものは揃ってるっぽい。
  • 脱ボイラープレートできそうな雰囲気はある。
    • gulpfileをメンテナンスし続けるのつらいので…
  • Node.jsで完結できるところが魅力的。

次は、Stylus to SCSSとかやって記事にしてみるかな。 f:id:daikiri1013:20160204005337p:plain 現場からは以上です。