Download as PDF, PPTX
Uploaded byMonaca
PDF, PPTX13,909 views
120分聞けばドヤ顔で語れる apache cordova スーパー勉強会
「120分聞けばドヤ顔で語れる Apache Cordova スーパー勉強会」にて発表したCordovaに関する紹介です。http://atnd.org/events/51539
Recommended
More Related Content
What's hot
Similar to 120分聞けばドヤ顔で語れる apache cordova スーパー勉強会
More from Monaca
120分聞けばドヤ顔で語れる apache cordova スーパー勉強会
- 1.Apache Cordvaの話2014年6月10日アシアル株式会社 田中正裕MASAHIRO@ASIAL.CO.JP120分聞けばドヤ顔で語れるApache Cordova スーパー勉強会
- 2.自己紹介田中正裕アシアル株式会社 代表取締役Twitter: @massieE-mail:masahiro@asial.co.jpアシアル執筆の最近の書籍2011年発刊、PhoneGap 0.9ベース
- 3.
- 4.PhoneGap/Cordovaの会社 PhoneGapを用いたアプリ開発 Monacahttp://monaca.mobi/ Onsen UI http://onsenui.io/
- 5.Monaca クラウドベースのPhoneGap/Cordova開発環境（GUI） iOS,Android, Windows 8対応Firefox OS, Chrome Appsに近日対応予定 コマンドラインにも近日対応 無料～（商用利用でも） デバッガーを組み込み 日本語サポート・ドキュメント Windowsマシンでも開発OKhttp://monaca.mobi/
- 6.Monacaのユーザー 2000アプリが既にリリース 200以上の法人アカウントカジュアルアプリのデベロッパー システムインテグレータの方 同じスキルでiOS、Androidいずれのアプリも開発可能
- 7.
- 8.
- 9.
- 10.Cordovaの歴史 NitobiがPhoneGapをつくる AdobeがNitobiを買収PhoneGapはAdobeの商標に Apache FoundationにPhoneGapソースコードを移管 旧Nitobiチームは、ゆかりのある名前をつけたかった 「Cordova」に決定
- 11.
- 12.
- 13.細かい違い① コマンドコマンド サブコマンドcordova Phonegap 説明create ○ ○ プロジェクトを作成するserve ○ ○ローカルWebサーバーで起動（Developer App等で使用）build ○ ○ ビルドinstall ○ デバイスへのインストールrun ○ ○ デバイス上で実行plugin ○ ○ プラグインの追加/削除/検索prepare ○ ビルドイメージを作成compile ○ コンパイルを実施emulate ○ エミュレータ上で実行（run --emulatorと同じ）remotelogin/logout/build/install/run○ PhoneGap Build用コマンドlocal build/install/run/plugin ○ ローカル開発用コマンド
- 14.
- 15.
- 16.その他の違い 使用できるバージョンが異なる Cordova= 3.5 PhoneGap Build = 3.4 ネイティブコードの記述できる範囲が異なる Cordova = 自由にネイティブ側に手を入れられる PhoneGap Build = PhoneGapプラグインのみ PhoneGapには追加機能が PhoneGap Enterprise PhoneGap Developer App等
- 17.Cordovaと、その一味PhoneGapMonacaIonic FrameworkMS VisualStudioGoogle ChromeApps MobileIBM Worklight全部、同じものがつくれる。
- 18.モバイルWebとの違いモバイルブラウザー CordovaブラウザエンジンiOS:SafariかUIWebViewAndroid:WebView、Chrome等iOS:UIWebView (Nitro非対応)Android:WebViewHTML5、CSS、JSの対応度同じJavaScript APIの拡張 × ○Same-Origin Policy CORSヘッダー適用されないAccess Originで制御
- 19.
- 20.
- 21.
- 22.HTML5アプリの抱える課題 ユーザーインターフェース ネイティブアプリのようなスムーズなUIの実現実行パフォーマンス ストレスのない画面描画 セキュリティ HTMLやJavaScriptコードの漏洩を防止 デバイスAPI / ネイティブ機能 iOSやAndroidの全APIをHTML5から呼び出す
- 23.最近の動向 新しいブラウザーエンジンの登場 ChromiumベースのWebView互換エンジンiOS 8で登場するWKWebView モダンなUIフレームワークの登場 AngularJSベース：Ionic Framework、Onsen UI CSS3への最適化：famo.us Cordova Plugin Registryの充実
- 24.Android WebView IntelCrosswalk Project Chrominiumベースのブラウザーエンジン。 TizenとAndroidに対応。 Ludei WebView+ （Cocoon JS） WebGLを有効にしたブラウザーエンジン。 3Dゲーム等に活用できる。 Amazon Silk Kindle Fire向けのブラウザーエンジン。 現状はAmazon HTML5/Web Apps Storeのみで有効。
- 25.WebView内包アプリの利点 Androidデバイスにおける差異を吸収 Android4.0以上であれば同じHTML5/CSS3/JS機能 デバッグのしやすさ Chrome Dev Toolsを使ったUSBデバッグが有効に 端末依存が少ない（画面サイズのみ） パフォーマンスの向上 最新のBlinkエンジンを利用できる デメリット ファイルサイズが大きく（8MB～15MB） 起動時間が長い
- 26.iOS 8のWKWebViewiOS 8WKWebViewiOS8UIWebViewiOS 7UIWebViewWebGL 3D Graphics ✓ ✓IndexedDB ✓HTML5 CoverageScore440/555 427/555 410/555SunSpiderBenchmark949.8ms 4249.6ms 3659.5msCSS Shapes ✓ ✓
- 27.モダンなJS UI FrameworkIonic Framework (http://ionicframework.com) AngularJSベースのUIフレームワーク。 Onsen UI (http://onsenui.io) 日本製。タブレットとAndroid 2.3にも対応。 Famo.us (http://famo.us) CSS3を用いて高速な描画を行うJSフレームワーク。
- 28.Cordova Plugin Registryhttp://plugins.cordova.io/Cordova 3.4からコアとプラグインを分離 これまでのAPIは全てプラグイン形式で配布 npmのプラグイン版 cordova pluginコマンドでインストール ユーザーがプラグインを投稿することも可能
- 29.
- 30.