Getting Started with Ionic - Ionic Frameworkをやってみたので忘れないようにメモを書きました。初投稿です。
開発環境を整える
OSX Yosemite (10.10.3)
準備しておくもの(OSX)
最新版のXCode
こちら(MacAppStore)から最新版のXCodeをダウンロードし、インストールします!
この中には、iOSエミュレータも含まれています。
Node.js
Node.jsのバージョン管理をしてくれるnodebrewでインストールしておくと、便利かつ使いやすそうです。
僕はHomebrewを使っているので、このサイトを参考にしました!
【Mac】nodebrewのインストールとコマンドなど使い方まとめ | TASK NOTES
Ionic関係をインストール
まず、Node.jsのモジュール管理ツールnpmでcordovaモジュールとionicモジュールをインストールします。
$ npm install -g cordova ionic
オプション -g はグローバルインストールと呼ばれ、これでシステムにパスが通ります。
つまり、システム全域でコマンド(モジュール)が使えるようになります。
追加で、ターミナルからiOSエミュレータを動作させるのにios-simモジュールが必要なのでインストールします。
$ npm install -g ios-sim
Ionicプロジェクトを作成
Ionicプロジェクトはこのコマンドで作成します。
$ ionic start myApp tabs
※ Cordovaでは「cordova create」となるように、ionicとcordovaではコマンドがちょっとずつ違ったりします!
「myApp」という名称の新しいフォルダに、tabsテンプレートの内容が展開されます。
テンプレートはblank(特別何も無い), tabs(タブ型ナビゲーション), sidemenu(ドロワー型ナビゲーション)の3つから、なんとなく作りたいものを選びます。
そして動かす
先ほど作られたフォルダへ移動し、対象プラットフォームにiOSを追加。
$ cd myApp
$ cd ionic platform add ios
ビルドした後、エミュレーターを起動します。
$ ionic build ios
$ ionic emulate ios
iOSエミュレータが起動し、アプリが起動します。
ふり返って
わざわざ書くほどの内容なのかよく考えるべきだったのかもしれないです。