51
東北デベロッパーズコミュニティ Sendai.html5 #1 HTML5概要とスマートフォン対応 2012423日本アイ・ビー・エム株式会社 ソフトウェア事業 WebSphere事業部 須江 信洋([email protected])

Html5勉強会 20120423

Embed Size (px)

DESCRIPTION

 

Citation preview

Page 1: Html5勉強会 20120423

東北デベロッパーズコミュニティ Sendai.html5 #1

HTML5概要とスマートフォン対応

2012年 4月 23日

日本アイ・ビー・エム株式会社

ソフトウェア事業 WebSphere事業部

須江 信洋([email protected])

Page 2: Html5勉強会 20120423

自己紹介

須江 信洋(すえ のぶひろ) –日本IBMにてミドルウェアのテクニカルセールスを担当

• 2000年頃からJavaEE関連の仕事

• 今年からモバイル関連製品も担当

–Twitter: @nobusue

–http://www.facebook.com/profile.php?id=732337788

コミュニティ活動 –Groovyコミュニティ(JGGUG)サポートスタッフ

• 「プログラミングGROOVY」執筆チーム

• 「Groovy イン・アクション」翻訳チーム

–日本Javaユーザーグループ(JJUG)幹事

–その他 • SCM BootCamp

• 「継続的デリバリー」読書会

2

Page 3: Html5勉強会 20120423

はじめに

今日の資料は書籍やWebの情報を参考に作成したものです。より詳しい(正確な)情報はこちらの情報源などをご参照いただくことをおすすめします。

「Google API Expertが解説するHTML5ガイドブック」 –http://www.amazon.co.jp/dp/4844329278

Googleグループ: html5-developers-jp –https://groups.google.com/group/html5-developers-jp

–白石さん主催、最新情報が日々届きます

HTML5.jp –http://www.html5.jp/

–羽田野さん主催、仕様書の翻訳などが充実

3

Page 4: Html5勉強会 20120423

Agenda

HTML5概要

モバイルWeb

ハイブリッド・アプリケーション

–PhoneGap / Apache Cordova

–IBM Worklight

4

Page 5: Html5勉強会 20120423

5

HTML5概要

Page 6: Html5勉強会 20120423

HTML5とは?

WHATWG および W3C が、 HTML4 に代わる次世代の HTML

として策定を進めている HTML 仕様

以下の点を改良 –リッチなWebアプリケーションの実現

–セマンティックなマークアップの枠組みの提供

–高いアクセシビリティの実現

–高い互換性の実現

対象範囲 –狭義のHTML5: Canvas/Media/Drag&Drop/オフラインなどのコア仕様

–広義のHTML5: 上記に加え、Web Storage/Web Workers/File API/Web

Socketsなどの周辺仕様を含む

6

Page 7: Html5勉強会 20120423

HTML5の基礎

最低限必要なのはDOCTYPE宣言のみ

7

<!DOCTYPE html>

<HTML>

<HEAD>

<title>HTML5サンプル</title>

<meta charset="UTF-8">

</HEAD>

<BODY>

<h1>HTML5サンプル</h1>

</BODY>

</HTML>

ブラウザに対してHTML5モードを指示

Page 8: Html5勉強会 20120423

HTML5対応状況 http://caniuse.com/#cats=CSS,HTML5,JS_API

8

Page 9: Html5勉強会 20120423

9

モバイルWeb

Page 10: Html5勉強会 20120423

モバイルから始めるHTML5

PC(特に業務系)ではまだ採用の敷居が高い – IEを標準ブラウザとしている企業が多数

– IE8以前では、HTML5のほとんどの機能に未対応

モバイルでは主要プラットフォームがHTML5 Ready – iPhone/iPad

–Android

–(Windows8)

ただし、モバイル特有の事情を考慮する必要あり –対応している仕様の偏り

–Video/Audioの非互換など

10

Page 11: Html5勉強会 20120423

Source: Wells Fargo Securities, January 23, 2012

“Fostering the People: The Shift to Engagement Apps”

2020年までには、世界で100億台

のモバイル機器が使用される

急成長するモバイル市場 インターネットに接続するデバイスの増加

台数

(百万

)

600

1200

0 2010 2011 2012 2013 2014 2015

WW ノートPC

WW タブレット

WW スマートフォン

WW PC

モバイルは新しいITの波

インターネットによってWebやeビジネス

の波が押し寄せたように、現在、モバイルによる新しい波が起きている

→全業種においてビジネス・チャンスに

11

Page 12: Html5勉強会 20120423

7割のCIOがIT戦略の優先事項として 「モバイル」を回答

今後3~5年で最も重要視している先見的なプラン (複数回答可)

ビジネス・インテリジェンスおよび分析

仮想化

ビジネス・プロセス管理(BPM)

セルフサービス・ポータル

リスク管理とコンプライアンス

クラウド・コンピューティング

モバイル・ソリューション

コラボレーションおよびソーシャル・ネットワーキング

60%

66%

61%

48%

19%

70%

72%

34% グローバル

日本

出所: 2011 CIO Study, Q12:「今後3 ~ 5 年間で競争力を高めるために、どのような先見的なプランをお持ちですか?」 日本(n=206) , グローバル (n=3,018)

83%

74%

68%

60%

58%

61%

57%

55%

12

Page 13: Html5勉強会 20120423

HTML5対応状況詳細(1/5)

13

http://mobilehtml5.org/

Page 14: Html5勉強会 20120423

HTML5対応状況詳細(2/5)

14

Page 15: Html5勉強会 20120423

HTML5対応状況詳細(3/5)

15

Page 16: Html5勉強会 20120423

HTML5対応状況詳細(4/5)

16

Page 17: Html5勉強会 20120423

HTML5対応状況詳細(5/5)

17

Page 18: Html5勉強会 20120423

モバイルで使える機能を中心に概要紹介

Application Cache

Web Storage

Geolocation

Canvas

Viewport definition

XMLHttpRequest 2.0

18

Page 19: Html5勉強会 20120423

Application Cache Webアプリをオフラインで利用するために、リソースをクライアント側でキャッシュするためのしくみ

–HTML,CSS,JavaScript,イメージなどURL指定できる全リソースが対象

–フォールバックやイベント処理が可能

キャッシュ対象リソースはマニフェストファイルで指定 –更新チェックはマニフェストファイルのみを確認

19

http://dev.w3.org/html5/spec/offline.html

CACHE MANIFEST

# This is comment line

clock.html

clock.css

clock.js

<!DOCTYPE HTML>

<html manifest="clock.manifest">

<head>

<title>Clock</title>

<script src="clock.js"></script>

<link rel="stylesheet" href="clock.css">

</head>

<body>

<p>The time is: <output id="clock"></output></p>

</body>

</html>

[clock.manifest]

[clock.html]

Page 20: Html5勉強会 20120423

Web Storage クライアント側でデータを永続化しておくためのストレージ

–シンプルなKey-Valueストレージ

–手軽に利用できる

–複雑・大量データを扱うのには不向き

Cookieとの違い –JavaScriptオブジェクトがそのまま格納できる

–自動的にサーバーに送信されない

–(仕様上は)サイズ制限がない

–有効期限という概念がない

用途によって2種類を使い分ける – localStorage

• Webサイトのオリジンごとに分離

• 永続期間は無制限

–sessionStorage • window(ブラウジングコンテキスト)と同じスコープを持ち、オリジンごとに分離

• windowが閉じられると削除される

20

http://dev.w3.org/html5/webstorage/

Page 21: Html5勉強会 20120423

Geolocation API デバイスの位置情報を取得するためのAPI

–緯度、経度、標高およびその精度

–デバイスの進行方向/進行速度

–位置情報取得時刻

シンプルなAPI –現在位置を一度だけ取得

• getCurrentPosition(successCallback, errorCallback, options)

–位置情報を継続して監視 • watchPosition(successCallback, errorCallback, options)

• clearWatch(watchId)

–具体的な取得方法などは隠蔽されている(高レベルAPI)

21

http://dev.w3.org/geo/api/spec-source.html

function showMap(position) {

// (position.coords.latitude, position.coords.longitude)を中心にMap表示

}

// One-shot position request.

navigator.geolocation.getCurrentPosition(showMap);

Page 22: Html5勉強会 20120423

Canvas

ブラウザ上でグラフィックスを自由に描画できる領域 –四角形、直線、円弧、ベジェ曲線

–画像

–グラデーション、影付け、重ね合わせ

–テキスト

–グラフィックス変形

–ピクセル操作による描画

描画コンテキストの保存/復元

画像データをURLとして取得 – toDataURL()によりbase64文字列に変換可能

22

http://dev.w3.org/html5/spec/the-canvas-element.html

Page 23: Html5勉強会 20120423

Canvasサンプル

23

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8"/>

<title>Hello Canvas</title>

<script>//<![CDATA[

function draw() {

var canvas = document.getElementById("canvas");

var ctx = canvas.getContext('2d');

ctx.beginPath();

ctx.fillRect(20, 20, 80, 40); // 四角(塗りつぶしあり)

ctx.strokeRect(120, 20, 80, 40); // 四角(塗りつぶしなし)

ctx.arc(70, 150, 60, 0, Math.PI*2, false); // 円

var message = '文字も書けます';

ctx.font = "bold 18px 'MS P Gothic'";

var textWidth = ctx.measureText(message).width;

ctx.fillStyle = "black";

ctx.textBaseline = "top";

ctx.fillText(message, 0, 220);

ctx.stroke();

}

//]]></script>

</head>

<body onload="draw()">

<canvas id="canvas" width="300" height="300"></canvas>

</body>

</html>

Page 24: Html5勉強会 20120423

Canvas: 参考情報

HTML5 Canvasのサンプル –http://sites.google.com/site/gorogoronyan/Home/html5-iroiro/javascript

–実用的な使い方のヒントとして

Ball Pool –http://mrdoob.com/projects/chromeexperiments/ball_pool/

–モバイルでも動作するインタラクティブな使い方のサンプルとして

24

Page 25: Html5勉強会 20120423

Viewport definition

ブラウザの表示サイズを制御 –コンテンツの横幅/縦幅

–初期倍率/最少倍率/最大倍率

–拡大縮小の可否

<meta name=“viewport” …>で指定 –コンテンツ内容に合わせてviewportを最適化

• http://www.mdn.co.jp/di/articles/2434/?page=8

viewport以外のiOS系固有のチューニングについてはこちら – iPhone 3G DevWiki -画面表示関係

• http://wiki.sohaya.com/index.php/%E7%94%BB%E9%9D%A2%E8%A1%A8%E7%A

4%BA%E9%96%A2%E4%BF%82

25

http://dev.w3.org/csswg/css-device-adapt/#viewport-meta-element

Page 26: Html5勉強会 20120423

XMLHttpRequest 2.0 クロスオリジンのリクエスト送信が可能に

–送信先サーバーの許可が必要 • Cross-Origin Resource Sharingに準拠

• http://dvcs.w3.org/hg/cors/raw-file/tip/Overview.html

文字列以外も送信可能に –Blob / Document / FormData

進捗状況がモニター可能に –uploadプロパティが追加された

–ダウンロード・アップロードの両方で進捗状況に応じたイベントが捕捉可能 • 進捗があるたびにonpregressイベントハンドラがコールバックされる

26

http://dev.w3.org/csswg/css-device-adapt/#viewport-meta-element

var xhrObj = new XMLHttpRequest();

xhrObj.upload.addEventListener("progress", progressFunction, false);

function progressFunction(evt){

var percentageDiv = document.getElementById("percentageCalc");

percentageDiv.innerHTML = Math.round(evt.loaded / evt.total * 100) + "%";

}

Page 27: Html5勉強会 20120423

リモート・デバッグ: Weinre

モバイルWeb開発(特に実機デバッグ)を効率的に行うためのツール

リモートから、FirebugやGoogle Dev Toolのような操作が可能 –DOM/CSSインスペクタとオンザフライ編集

–JavaScriptコンソール

–ブレークポイント設定とステップ実行

PhoneGap(改めApache Cordova)のサブプロジェクト –ドキュメントとバイナリ

• http://people.apache.org/~pmuellr/weinre/

–ソース • https://github.com/apache/incubator-cordova-weinre

使い方など –スマホの開発が超絶楽に! weinreでスマートフォンをPCでリモートデバッグ!

• http://css-eblog.com/tools/weinre.html

–スマートフォンサイト構築のためのリモートデバッグ環境その1 – weinre • http://blog.alt-scape.com/archives/423

27

Page 28: Html5勉強会 20120423

Weinre実行例: コンソール

28

Page 29: Html5勉強会 20120423

Weinre実行例: デバッグ

29

Page 30: Html5勉強会 20120423

30

ハイブリッド・ アプリケーション

Page 31: Html5勉強会 20120423

モバイル・アプリケーションの特徴と課題

様々な機種が混在

セキュリティ

開発生産性

アプリケーション管理

企業システムとの連携

スマートフォンやタブレット等多様なデバイス

- 異なる画面サイズ

- デバイス固有機能の提供

様々なOSが混在

iOS, Android, Blackberry, Windows Phone 等の複数プラットフォームが存在

• OSごとに異なる開発言語が必要

• デバイス固有機能に対するスキル

• デバイス毎にテストする負荷が高い

• 暗号化や認証の仕組み

• デバイスの紛失や盗難への対応

• アプリケーションが最新かどうか

• リモートからアプリケーションを無効化できるか

• エンタープライズ・システムとの統合

• マルチチャネル対応アプリケーションの構築

特徴 課題

端末管理

• デバイスの監視、管理

• デバイス上のソフトウェア更新、データ配布

モバイル・エンタープライズ・アプリケーション・プラットフォーム

(MEAP)

ソリューション

モバイル端末管理 (MDM)

31

Page 32: Html5勉強会 20120423

モバイル・アプリケーションのトレンド

ネイティブ・ アプリケーション

Web アプリケーション

ハイブリッド・ アプリケーション

コードの大部分を再利用可能なWeb技術を使って開発。 デバイス依存の機能はネイティブ・コードで補完。

デバイス固有の機能を活用できるが、開発・テストの負荷が高い。

オープンな技術(HTML5, CSS, JavaScript)を使用。 開発生産性やポータビリティは高いが、デバイス特有の機能は使えない。

ユーザビリティ

セキュリティ

クロス・プラットフォーム 開発コスト

32

Page 33: Html5勉強会 20120423

ハイブリッド・アプリケーションとは

Application

Stores File System

(on mobile

device)

Native Container

HTML, CSS, JavaScript

Mobile Operating System

Webアプリケーションと

ネイティブ・アプリケーションの組み合わせ 基本的にはHTML5、CSS、 JavaScriptを使用するが、

デバイスの機能にもアクセス可能

App StoreやAndroid Marketなどから アプリケーションをダウンロードし、モバイル・デバイス上にアプリケーションを保管する。

33

Page 34: Html5勉強会 20120423

PhoneGap (Apache Cordova)

ハイブリッド・アプリケーションのプラットフォーム –http://phonegap.com/

–http://incubator.apache.org/cordova/

Webブラウザ+プラグイン –Webコード(HTML/CSS/JS)はWebブラウザコンポーネント上で実行

• トランスコードソリューションではなく、実行時もWebコードのまま

–WebコードからJavaScript経由でネィティブコードを実行可能(プラグイン)

–標準プラグインが豊富に存在し、独自拡張も可能

歴史的経緯 –PhoneGapを開発していたNitobiがAdobeに買収される

–PhoneGapのコアをApache Callbackプロジェクトに移管

–Apache CallbackプロジェクトがApache Cordovaプロジェクトに改名 • Apache CordovaにはAdobe以外にもIBM/RIM/Microsoftなどが協力

• PhoneGapはApache Cordovaの1ディストリビューションという位置づけに

• http://phonegap.com/2012/03/19/phonegap-cordova-and-what%E2%80%99s-in-a-

name/

34

Page 35: Html5勉強会 20120423

PhoneGap: 幅広いプラットフォームに対応

35

Page 36: Html5勉強会 20120423

PhoneGap: プラグインの利用例

ネットワークの回線種別を判定

36 http://docs.phonegap.com/en/1.6.1/cordova_connection_connection.md.html#Connection

Page 37: Html5勉強会 20120423

IBM Worklight : モバイル・アプリケーション・プラットフォーム

Build once. Run anywhere. – Android, iOS, Blackberry, Microsoft – スマートフォンとタブレット

標準ベース、エンタープライズ対応 – PhoneGap, Java – アプリケーション配布 – エンタープライズとの統合 – セキュリティー – スケーラビリティ – 管理

Build it today. Change it tomorrow. – アプリケーション・ライフサイクル管理 – 保守とアップデート

HTML5、ハイブリッド、ネイティブ・アプリケーションのための、オープンかつ先進的なモバイル・アプリケーション・プラットフォーム

37

Page 38: Html5勉強会 20120423

Worklight Server 統合通知、ランタイム・スキニング、バージョン管理、セキュリティー、統合、配布

Worklight Console リアルタイム分析、および、モバイル・アプリケーションとインフラ管理のためのWebベースのコンソール

Worklight Studio コード再利用の最大化とデバイス毎の最適化を実現する包括的で拡張性に優れた開発環境

Worklight のコンポーネント

Worklight Runtime Components ネイティブのデバイス機能と連携可能な豊富なライブラリーとクライアントAPI ←

Tomcat or WAS 上で稼働

Eclipse ベース

38

Page 39: Html5勉強会 20120423

サポートする環境(Environment)

様々なタイプのプラットフォームに対応

モバイル – iPhone – iPad – Android – BlackBerry – Windows Phone – Mobile web app

デスクトップ – Windows 7 and Vista(ガジェット) – Adobe AIR – Mac OS Dashboard

Web アプリケーション – Facebook – iGoogle – Embedded web page

39

Page 40: Html5勉強会 20120423

Build and Deploy

すべてのコードをビルドしてデプロイ

ネィティブSDK用のプロジェクトを生成

アプリケーション(Webコード)をWorklight Serverへデプロイ 40

基本部分はcommonに、 差分を個別環境のフォルダへ

Page 41: Html5勉強会 20120423

Worklight のハイブリッド・アプリケーション ネィティブ・アプリとしてインストール 例: – iOSに対しては、拡張子IPA のファイル

– Androidに対しては、拡張子APKのファイル

Apple AppStore やAndroid Marketにアップロード可能

Worklight Runtime Component はアプリの一部としてデプロイされ、HTML5コードを解釈可能

デバイス固有の機能への完全なアクセス(カメラ、GPSなど)

Web言語でコーディングし、ネィティブアプリとして実行

Worklight Runtime Component

Web Code

<!DOCTYPE html PUBLIC <html> <! - - created 2003-12-1 <head><title>XYZ</title </head> </body> </html>

Device APIs

デプロイされたネィティブアプリ

41

Page 42: Html5勉強会 20120423

Worklightのアプリケーション・タイプ ネィティブアプリ

プラットフォーム固有。固有のスキルを必要とし、開発にはコストと時間がかかる。高いレベルのユーザーエクスペリエンスを実現できる。

Native

Application

Device APIs

1001010101011101001010010010101110100100110101010101001001001011110010011001010101001010101010010101010101010101010111111000001010101010101001001010101010101000111101010001111010100111010101111100101101111010001011001110

ハイブリッド(Mixed)

ユーザー固有のニーズを実現するネィティブコードでWebを拡張し、ユーザーエクスペリエンスを最大化。

Worklight Runtime

Web

Native

Device APIs

<!DOCTYPE html PUBLIC created 2003-12 </p> </body> </html>

10010101010111010010101010101010010010010111100100110010

ハイブリッド(Web)

ソースコードはWebとWorklightのライブラリを含み、ネィティブのシェル内で実行される。

Worklight Runtime

Web Code <!DOCTYPE html

PUBLIC

<html>

<! - - created 2003-12-1

<head><title>XYZ</title

</head>

</body>

</html>

Device APIs

Webアプリ

HTML5, JavaScript ,

CSS3で記述。高速かつローコストで開発可能だが、機能性はネィティブよりも劣る。

Mobile Browser

Web Code <!DOCTYPE html

PUBLIC

<html>

<! - - created 2003-12-

12 - -

<head><title>XYZ</title

>

</head>

<body>

</p>

</body>

</html>

42

Page 43: Html5勉強会 20120423

ハイブリッド(Mixed)の利用イメージ

ハイブリッド(Mixed)

ユーザー固有のニーズを実現するネィティブコードでWebを拡張し、ユーザーエクスペリエンスを最大化。

Worklight Runtime

Web Native

Device APIs

<!DOCTYPE html PUBLIC created 2003-12 </p> </body> </html>

10010101010111010010101010101010010010010111100100110010

プラグイン(ドライバ) による拡張

Webとネィティブの 画面混在 Web

画面

ネィティブ 画面

Web 画面

共通のユーザーセッションとデータ

Web 画面

Worklight Client Runtime

Worklight Client Runtime

Worklight 標準

プラグイン

ユーザー 独自

プラグイン

ネィティブ機能の 呼出し

43

Page 44: Html5勉強会 20120423

主要なライブラリ/ツールとの統合

Worklightは主要なHTML5ライブラリ/ツールと統合可能:

44

Page 45: Html5勉強会 20120423

Worklightのランタイム・アーキテクチャ

Worklight Server

Authentication

JSON Translation

Server-side Application Code

Adapter Library

Client-side App Resources

Direct Update

Mobile Web Apps

Unified Push Notifications

Sta

ts A

gg

reg

ation

Device Runtime

Ap

plic

atio

n C

od

e

• Cross Platform Technology

• Security and Authentication

• Back-end Data Integration

• Post-deployment control and Diagnostics

45

Page 46: Html5勉強会 20120423

サーバーサイド・アダプター

• Worklight Platformはアダプターを利用して様々なバックエンド・システムへの接続を実現

•アダプターの用途 •情報の取得

•アクション(ロジック)実行

•標準提供アダプター •SQL Adapter

•HTTP Adapter (RESTとSOAPに対応)

Query

Update data

Data/Result

as JSON

Invoke adapter

procedure

SQL WS

Worklight

HTTP

Response

1

2 3

4

46

Page 47: Html5勉強会 20120423

柔軟なプッシュ通知のフレームワーク

同じアプケーションへの複数ユーザーログイン

同じバックエンドからの複数イベント・ソース

イベント・ソースとアプリケーション間での Many-to-many リレーションシップ

1つのアプリケーションで、複数のデバイスに対応

iOSとAndroidに共通のAPI

47

Page 48: Html5勉強会 20120423

モバイル・アプリケーションのセキュリティ

アプリケーション・セキュリティ 堅固な認証・認可

企業のセキュリティ・プロセスの効率化

デバイス上のデータの保護

認証統合

フレームワーク

データ保護 レルム

デバイスidを併用

組織のサンドボックスとしてのシェル

コードの 難読化

SSLによる

サーバーの検証

実証済みのプラット

フォーム・セキュリティ

Jailbreak and malware detection

App authenticity

testing

Encrypted offline cache

Offline authentication

Secure challenge-

response on startup

Encrypted offline cache

Offline authentication

Secure challenge-

response on startup

Encrypted offline cache

Offline authentication

Jailbreak and malware detection

Secure challenge-

response on startup

Encrypted offline cache

Offline authentication

アプリケーションの真正性テスト

Jailbreakおよ

びマルウェアの検出

起動時の セキュア

チャレンジ-レスポンス

暗号化されたオフラインキャッシュ

オフライン 認証

強制セキュリティ・アップデート

リモート 無効化

直接 アップデート

48

Page 49: Html5勉強会 20120423

Direct Update: Worklight Serverから更新版を直接配布

Worklight

Server

Worklight Runtime

パッケージされたリソース

1 ダウンロード

4 Webリソースを更新

App Store

Web

リソース

キャッシュされたリソース

1.初期のオフライン実行を可能にするため、Webリソースがア

プリケーション内にパッケージングされている

2.Webリソースはアプリケーショ

ンのキャッシュストレージに転送される

3.アプリケーションは更新を確認する • 起動時

• フォアグラウンドになった時

4.必要であればWebリソースをダウンロードして更新する

2 転送

3 更新を確認

49

Page 50: Html5勉強会 20120423

PhoneGap(Cordova)とIBM Worklightの比較

PhoneGap Worklight

ネィティブ連携 PhoneGapプラグイン PhoneGapプラグイン

+Worklightプラグイン

PhoneGapスキル 必要 通常は不要

プラグイン開発時のみ必要

クロスプラットフォーム対応 プラットフォーム毎にソースを管理

アプリ単位で複数プラットフォームのソース管理を共通化

セキュリティ機能 なし

改ざん・覗き見防止

暗号化ストレージ

認証フレームワーク

バックエンド連携 XMLHttpRequestなどを利用して独自に開発

アダプター

アプリケーション更新 再インストール Direct Update

(Webコードの部分のみ更新)

監視・分析 なし 管理コンソール

商用サポート なし あり 50

Page 51: Html5勉強会 20120423

まとめ モバイル・デバイスは急成長中のプラットフォーム

HTML5はモバイルから始めよう

モバイル・アプリケーションの課題解決にはハイブリッド・アプリケーションによるアプローチが有効

–開発生産性、保守性、クロス・プラットフォーム対応

ただし、エンタープライズ・システムへの適用にはほかにも課題が –セキュリティ(デバイスレベル/アプリケーションレベル) –バックエンドシステム連携

IBM Worklightは、これらの課題を解決するMEAP(Mobile

Enterprise Application Platform) –PhoneGap(Apache Cordova)ベースだが、PhoneGapを知らなくてもOK

–PhoneGapプラグインが使える

51