Sass, Haml, CoffeeScript… あらゆるテンプレートエンジンを自動変換する便利ツール『Prepros』
Webサイトを作るとき、HTMLとCSSファイルを直接弄ってコーディングしてますか?それはもしかすると、テンプレートエンジンを使ってもっと楽をするべきかもしれませんよ。
■テンプレートエンジンとは
HTML, CSS, JavaScript等をはじめとした、プログラミング言語のソースコードを、本来よりも短い記述で表現し、開発の効率を高めることができるものの事です。
例えば、僕がこのブログのリニューアルテーマをコーディングする時に使っているJadeエンジンでは…
このような、よくあるHTMLのソースコードを
こんな感じで、かなり簡略化して記述することができます。
テンプレートエンジンを使えば、ただ単にソースコードを簡略化するだけではなく、変数を代入したり、繰り返し処理をしたり、計算処理をしたりといった様々な恩恵を得ることができます。
■テンプレートエンジンの敷居
テンプレートエンジンには様々な種類があります。書き方はもちろん、導入方法もコンパイルも、エンジンそれぞれの使い方に合わせなければなりません。HTMLやCSSの記述を効率化したいのに、そのためのコンパイル作業が面倒だったら本末転倒です。
■そこでおすすめしたいのが『Prepros』
Preprosは、各テンプレートエンジンのソースコード(***.jade、***.sass)を自動で監視し、HTMLやCSSに自動変換してくれるという優れもの。
フリーで、Windows、Mac両方に対応していて、難しい事前処理も一切無し。インストールして、監視したいプロジェクトを指定するだけです。
凄いことに、Sass, LESS, Stylus, Jade, Haml, Slim, CoffeeScript, LiveScript, Javascript, Markdown など、主要なテンプレートエンジンを網羅しています。
さらに、自動ブラウザリロード機能まで付いているので、ライブコーディングのような事もできます。
UIもシンプルでクールなので、ドキュメントなどを使わなくても、少し触るだけで使い勝手がわかると思います。
より効率の良い開発のために、是非とも検討してみてください。
公式サイト: Prepros(ダウンロードはこちらから)
※この記事は著者の参加する共同ブログ campus-note.com からの引用です。