Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Cordovaの特徴と開発手法概要

1,264 views

Published on

2016/09/07 2016年9月定例会「クロスプラットフォーム開発最前線」の発表資料です。

Published in: Engineering
  • Be the first to comment

Cordovaの特徴と開発手法概要

  1. 1. Bringing More People To Apps Cordovaの特徴と 開発手法概要 アシアル株式会社 生形 可奈子 1
  2. 2. Bringing More People To Apps 生形可奈子(うぶかたかなこ) アシアル株式会社 Monacaエバンジェリスト 2 Cordova の章
  3. 3. Bringing More People To Apps Cordovaとは? 3
  4. 4. Bringing More People To Apps HTML5アプリ用フレームワーク Cordova Apacheソフトウェア財団 PhoneGap アドビシステムズ 4
  5. 5. Bringing More People To Apps Cordova?PhoneGap?  2008年、Nitobi社がPhoneGapを開発。  2011年、Adobe社がNitobi社を買収。 PhoneGapはApache財団に寄贈され、名称を「Cordova」に変更。 同時に「PhoneGap」はAdobeの登録商標に。 5
  6. 6. Bringing More People To Apps Cordovaコミッターの会合@マイクロソフト 6
  7. 7. Bringing More People To Apps Web標準技術(HTML/CSS/JavaScript) でアプリ開発  WebView上にHTMLをロードしてUIを作成するので、Web開 発と同じ方法でモバイルアプリ開発が可能 7
  8. 8. Bringing More People To Apps Cordovaの仕組み 8 Cordova層 HTML5層 (WebView) アプリ本体はHTML5で実装 CordovaがOSに合わせた ネイティブコードを提供 OS 1. JavaScriptでAPI実行 2. Cordovaがネイティブ 機能を実行
  9. 9. Bringing More People To Apps プラグインでネイティブ機能を拡張  ネイティブの各種機能は、プラグイン形式で実装されている  標準プラグインの他にも、第三者によって提供されたプラグインを 取り込んで機能を拡張できる 9 標準プラグイン ・カメラ ・位置情報 ・電話帳 ・加速度センサー ・ファイルアクセス サードパーティ製 プラグイン ・Bluetooth ・プッシュ通知 ・アプリ内課金 ・バーコード読取 ・IoT 自作プラグイン
  10. 10. Bringing More People To Apps 事例:タニタヘルスプラネット ▶ 体組成計連携の健康管理アプリを2ヶ月で開発 ▶ Bluetooth、NFCを使って専用の体組成計、歩数計からデータを自 動で受け取ることが可能 10
  11. 11. Bringing More People To Apps CordovaはCross PlatformツールNo.1 11 61% 35% 31% 18% 15% 13% 12% 9% 4% 3% 0% 10% 20% 30% 40% 50% 60% 70% PhoneGap/Cordova Xamarin Unity Qt Adobe Air Appcelerator Corona Marmelade Codename One Live Code Using this tool Vision Mobile Analysis of Cross-Platform Development, July 2015
  12. 12. Bringing More People To Apps 様々なソリューションがCordovaを採用 12
  13. 13. Bringing More People To Apps Cordovaの課題? 13
  14. 14. Bringing More People To Apps Cordovaの課題としてしばしば挙げられ るもの 1. パフォーマンス 2. 脆弱性対策 14
  15. 15. Bringing More People To Apps 端末の大幅な進化 初代Xperia Xperia Z 5 発売日: 2010年4月 Android 1.6 (後に2.1) 1GHz シングルコアCPU 384MBメモリー ベンチマークスコア: 3361 発売日: 2016年6月 Android 6.0 2GHz クワッド(8)コアCPU 3GBメモリー ベンチマークスコア: 52084 5年間で20倍もの スピードアップ 15
  16. 16. Bringing More People To Apps HTML5アプリ向けUIフレームワークの登 場 16
  17. 17. Bringing More People To Apps Onsen UI  ハイパフォーマンスなUIを実現  プラットフォームを判別して自動でスタイルが変化 17
  18. 18. Bringing More People To Apps 豊富なUIパーツを利用可能 18
  19. 19. Bringing More People To Apps 使い方は独自タグを記述するだけの簡単設 計 <ons-toolbar></ons-toolbar> <ons-list-item></ons-list-item> <ons-tabbar></ons-tabbar> 19
  20. 20. Bringing More People To Apps 様々なJSフレームワークとの組み合わせ が可能 20
  21. 21. Bringing More People To Apps 事例:ジャパンネット銀行 残高確認アプリ ▶Onsen UIでネイティブと遜色ないUIを実現 21
  22. 22. Bringing More People To Apps Cordovaの脆弱性に関する問題 22
  23. 23. Bringing More People To Apps Cordovaアプリにおける脆弱性の種類 23 1. Cordovaに依存する脆弱性 ▶ 最新バージョンのCordovaを利用する 2. アプリの実装に依存する脆弱性 ▶ Webアプリと同様にXSS対策などが必要 3. WebViewに依存する脆弱性 ▶ Android5.0以降はGoogle Playから随時アップデートされる
  24. 24. Bringing More People To Apps 古いWebViewが抱える問題  Android4.4まではWebViewがOSに付属するため、アップデートは メーカーから提供される(脆弱性放置の危険性)  GoogleがAndroid4.3以前のWebViewに対するセキュリティパッ チの提供を終了した 24
  25. 25. Bringing More People To Apps Crosswalk使用通常のCordovaアプリ Androidアプリ  ChromiumベースのWebView  アプリ内に埋め込んで配布することが可能 Androidアプリ 端末の WebView Intel Crosswalk 25
  26. 26. Bringing More People To Apps Cordova開発におけるポイントまとめ  Webの技術でクロスプラットフォーム開発  Web技術者のスキルを活用  既存システムの流用が可能  Web技術でもネイティブ機能が利用可  パフォーマンスやセキュリティ対策ツールも完備  UIフレームワークやCrosswalkの導入はほぼ必須 26
  27. 27. Bringing More People To Apps Monacaもよろしくお願いします!  15万人が利用するCordova開発環境(IDE)  実機によるリアルタイム検証が可能  WindowsマシンでもiOSアプリ開発OK https://ja.monaca.io/ 27

×