1. CORDOVA (PHONEGAP)
で始める、スマホアプリ開発
!
2014年3月
アルティザンエッジ合同会社 井上 研一

2. CORDOVA (PHONEGAP) とは？

3. CORDOVAとPHONEGAP
•
基本的に、CordovaとPhoneGapは同じものです。
•
Cordova
•
Apache Software Foundationに寄贈され、開発が行われてい
るプロダクト名。
•
PhoneGap
•
•
CordovaをAdobeが扱う場合のブランド名。
この資料では、主にCordovaと呼びます。

4. ネイティブアプリ
•
ネイティブアプリとは、その端末のネイティブ言語で記述されたアプリ
のことを言います。
•
iPhone/iPad (iOS)： Objective-C
•
Android： Java
•
Firefox OS： HTML5、JavaScript ←！
•
ネイティブアプリは基本的に高速に動作しますが、開発はやや面倒です。
•
例えば、iOSアプリとAndroidアプリのワンソース開発は出来ません。

5. CORDOVAでは？
•
Cordovaで作ったアプリは、見かけ上はネイティブアプリと同様に動作
します。
•
Webブラウザ＋αのシンプルなネイティブアプリの中で、Webアプリが
動いている感じ。
•
HTML5、JavaScriptで開発します。
•
ネイティブアプリよりは動作は遅めです。
•
•
3Dゲームを作ろうとかしない限りは、まず大丈夫です。
例えば、iOSアプリとAndroidアプリのワンソース開発が出来ます！

6. UIViewController
UIWebView
index.html

7. よくある質問
•
オフラインでも使えるの？
•
アプリで必要なHTMLファイル、JavaScriptファイ
ル等はすべて、配布するアプリ内に入れてしまうの
で、オフラインでも使えます。
•
カメラとか、端末特有の機能は使えるの？
•
Cordovaには、端末特有の機能を使うための豊富な
プラグインが準備されています。

8. TITANIUM MOBILEとの違い
•
Titanium Mobile
•
JavaScriptで開発するのは同じです。
•
JavaScriptで書いたコードが、ネイティブにコンパイル
されます。
•
Cordova
•
JavaScriptで書いたコードが、アプリのブラウザ内で実
行されます。

9. CORDOVAアプリの構造

10. CORDOVAアプリで書くコード
•
HTML
•
CSS
•
JavaScript
•
Objective-C、Java・・・
•
独自でプラグインを作るときだけ

11. CORDOVAアプリを簡単に作るため
に・・・
•
jQuery
•
•
jQuery Mobile
•
•
JavaScriptを書くなら、やっぱり
スマホアプリっぽい見た目を実現！
Backbone.js
•
ModelとViewを分けて書くためのフレームワーク

12. 余談
•
CoffeeScript
•
JavaScriptのコードを簡潔に書けます。
•
コンパイルすると、出来の良いJavaScriptコード
になります。

13. jQuery Mobile なし
jQuery Mobile あり