モバイル向け軽量CSSフレームワークRatchetが2になって帰ってきた！

急にGithub PagesにあったRatchetのページが消えていた（参考）。

ついにRatchet死んじゃったのかな・・・デザインも古臭かったしなーと思っていたら、なんとRatchet2になって帰ってきていました。しかも、Twitter Bootstrapのチームの一員として。

Ratchet2のここが凄い

ratchet-examples-sm

http://goratchet.com/examples/

iOS用デザイン、Android用デザイン両方揃っている！

大体のモバイル向けCSSフレームワークがiOSぽいデザインしかないのに対して、Ratchet2ではAndroidぽいデザインも用意されています。クロスプラットフォーム対応を考えると嬉しいかも。

内部がSassで書かれているのでカスタマイズも楽！

CSSだけでゴリゴリ書かれているのではなく、内部はSassで書かれているので、比較的カスタマイズも簡単です。variables.css.scssを書き換えれば、色味の変更も比較的楽にできます。

クラス名がTwitter Bootstrapぽい！

クラス名がTwitter Bootstrapを踏襲した名前になっているので、Twitter Bootstrapを使っている人には使いやすい設計になっています。

ionicと比較すると・・・

ionicはAngularJSと組み合わせるのがほぼ前提になっているのに対して、Ratchet2はそういった前提が全くないので、jQueryなどと組み合わせてサクサクとそれっぽいアプリを作ることができるのがメリットです。

少し大きめのアプリであればionicの方が良い気もしますが、プロトタイプであればRatchet2でゴリゴリ作っていく方が手早いかと思います。

ionicについてはこんな記事を書いているので、ぜひご参照下さい。

モバイルアプリ向けUIフレームワークionicがSassで作られている＆AngularJSに最適化されていて俺得すぎる

参考

Introducing Ratchet 2

Ratchet – Build mobile apps with simple HTML‚ CSS‚ and JS components.

ちなみに過去のRatchetのドキュメントは以下にあります。

Ratchet – Prototype iPhone apps with simple HTML, CSS, and JS components.