IonicはWebbaseのアプリを作るためフレームワークです.HTML,CSS,JavasciptでiOS,Androidのアプリを作ることができます.パフォーマンス的にはネイティブコードで書いたアプリより劣るという欠点がありますが,クロスプラッフォーム性,Web Viewの流用可という点も考えると使いドコロは一応あるでしょう.このIonicはアプリに必要な部品をフレームワーク側が提供してくれていて,割りと簡単にViewを作成することができます.
以下,初期設定のメモ.Ionicの標準だとsass,coffeeが含まれていないようだったので手動で設定しました.
ionicのインストール
$ npm install -g cordova ionic
scaffold
$ ionic start myApp sidemenu
$ cd myApp
$ npm install
$ bower install
$ gulp install
$ ionic setup sass
$ ionic platform add ios
js -> coffee変換
coffeeの導入
$ npm install --save-dev coffee-script
$ npm install --save-dev gulp-coffee
$ npm install -g js2coffee
$ mkdir coffee
gulpfile.jsを書き換える
require('coffee-script/register');
require('./gulpfile.coffee');
Compile
$ gulp coffee
watch task にcoffeeを加える
gulpfile.coffee
paths = sass: [ './scss/**/*.scss' ], coffee: ['./coffee/**/*.coffee']
gulp.task 'watch', ->
gulp.watch paths.sass, [ 'sass' ]
gulp.watch paths.coffee, ['coffee']
return
gitignoreに追記
www/js/*.js
www/css/*.css
www/lib/
emulator
ripple
$ npm install -g ripple-emulator
$ ripple emulate --path www/
標準
$ ionic emulate ios