Phone gap + monaca

Post on 28-May-2015

511 views 2 download

description

2013/09/07の "Android × HTML5 in Fukuoka" でLTした際の資料です。

Transcript of Phone gap + monaca

PhoneGap + MonacaHTML5でクロスプラットフォームアプリをつくる

1

自己紹介

• akimicyu

• フリーランスSE

• Android屋、Java屋、DB屋、OO厨

2

PhoneGapとは• クロスプラットフォームなモバイルアプリ開発フレームワーク

• 開発には、HTML5/CSS/JavaScriptを使用

• カメラ/GPSなどの端末機能にJavaScriptのAPIでアクセスできる

• 要は「Android/iOS両対応なアプリが簡単に書ける」といった感じ

3

Monacaとは• PhoneGap開発をもっと楽にするためのサービス

• ブラウザベースのIDE

• デバッガ

• バックエンド

• http://monaca.mobi/

4

デモ

5

触ってみた感想• 利点

• 簡単なアプリであれば、HTML5/CSS/JavaScriptのみでかなりの部分まで書けて楽(PhoneGap)

• WebベースのIDEやMonacaデバッガといった開発環境が非常に楽(Monaca)

• 課題点

• 性能面、特にレスポンス性能を求めだすと面倒そう

• ネイティブでプラグインをゴリゴリ書き出すと面倒そう

6

(例) 検討のタイミング• 業務系のAndroidアプリを作るはずが、iOS版も作ることになってしまった

• スマホ向けのWebアプリを作っていたのに、電波が届かない地域でも利用できるように対応して欲しいとか無茶な要件が入ってきた(マスタデータの確実な自動更新とかは、プッシュ通知系の機能がないと無理)

• HTML5で作ってたカジュアルゲームをGoogle play

やApp Storeに乗せてお小遣いを稼ぎたい

7

まとめ

• 手軽にクロスプラットフォームアプリを作りたいなら、PhoneGap + Monacaはいい選択

• 特に、Web系の業務システム開発では重宝する場面が多いはず

8

参考URL

• PhoneGap API リファレンス

• http://docs.phonegap.com/jp/2.2.0/index.html

• Monacaドキュメント

• http://docs.monaca.mobi/ja/

• かつや先生のPhoneGap講座

• http://phonegap-fan.com/school/

9