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

Pocket

HTML5でモバイルアプリを作るなら、UIはionicで決まりなのでは!と思えるぐらい良いライブラリです。AngularJS&Sass派の人はぜひ使ってみてはいかがでしょうか。

はじめからAngularJSで使うことを念頭に置かれているのが良い

はじめからAngularJSで使うことを念頭に置かれているので、モバイルアプリで当たり前に使う機能をAngularJSから簡単に操作できるように、ionic-angular.jsというライブラリが用意されています。

  • ナビゲーション(Views and Navigation)
  • テーブルビュー(List)
  • タブバー(Tab Bar)
  • スライドメニュー(Slide Menu)

などなど、一通りの機能がAngularJSから操作できるようになっています。

設計方針もCocoa Touchっぽくしているとのことで、iOSネイティブで開発していた人にもとっつきやすい設計になっています。つまり俺得です。

サンプルがカッコ良い

サンプルがそれなりにカッコ良いのはUIライブラリを使う上で重要です。ionicのサンプルはそれなりにカッコ良いです。

Ionic Framework Showcase

Ionic_Framework_Showcase_-_Ionic_Framework 2

Ionic_Framework_Showcase_-_Ionic_Framework 3

Ionic_Framework_Showcase_-_Ionic_Framework 4

Ionic_Framework_Showcase_-_Ionic_Framework 5

Ionic_Framework_Showcase_-_Ionic_Framework

Sassなのでスタイルをいじりやすい

イマドキCSSでやれと言われたら発狂しますよね。ionicはSassで作られているので、Sassベースでカスタマイズできるようになっています。

Customizing Ionic With Sass

ちょっとした色の調整も、Sassの変数で操作できるのが便利ですね。Sassと言う名のScssなのに注意が必要ですが。とにかくSassでスタイルをいじれるのも俺得ですね。

まとめ

軽量なモバイル向けフレームワーク、ということであればRachetも良い選択肢なのですが、AngularJSを使うならぜひionicを試したいところです。