visual studio 2013 と html5 で実現するマルチデバイス/マルチプラットフォーム...

Post on 28-May-2015

8.482 Views

Category:

Technology

4 Downloads

Preview:

Click to see full reader

DESCRIPTION

Visual Studio 2013 Update2 では HTML5 を使用して、Web サイトはもちろんのこと、Windows ストアアプリ、Windows Phone 8.1 アプリを同時開発できます。 また、Muiti-Device Hybrid Apps アドインを追加すると iOS、Android アプリの開発が可能になります。

TRANSCRIPT

Visual Studio 2013 と HTML5 で実現するマルチデバイス/マルチプラットフォームアプリの開発

物江修 (ものえおさむ)

デベロッパーエクスペリエンス & エバンジェリズム統括本部テクノロジーエバンジェリスト

アジェンダ

• Windows 8 と HTML5 アプリ

• Windows ストア アプリ

• ユニバーサル アプリ

• マルチデバイス ハイブリットアプリとは?

Windows 8 と HTML5 アプリ

アプリ開発基盤としての HTML5~ベンダーの垣根を越えた共通の仕様~

HTML5 を取り巻く状況

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

Chrome AppsFirefox OS

プラットフォーム

Titanium Mobile

Visual Studio 2013 HTML5 ~ Update 2 による大幅な機能強化~

2013

ユニバーサルアプリ

ネイティブアプリ

Web ストアアプリ Windows Phone XBOX

iOS

Multi-Device Hybrid Apps

Visual Studio 2013 HTML5 ~ Web、デバイス、プラットフォームの全方位 ~

Web

クロスデバイス

Update 2

クロスプラットフォーム

iOS

本日お話する内容

2013

Multi-Device Hybrid Apps

Windows Store Apps Universal Apps

Windows ストア アプリ

Windows ストア アプリ~ Windows 8 の新しい UI 環境で動作するアプリ~

既存のスキルを活かした開発~ さまざまな言語で開発が可能~

JavaScript

C#, VB

C, C++

HTML5

XAML

開発言語 UI 記述スキルセット

+

+

Web

.net

Native

HTML5 + JavaScript Windows ストアアプリの構造

ホストプロセス

オペレーティングシステム

アプリ

API

JavaScript

ネイティブ API

直接呼び出し(Compiled)

開発に使用する技術~ Web 標準とネイティブライブラリ~

WWAHost.exe Internet Explorer のスーパーセット

HTML5

CSS3(Trident)

Web 標準

WinJSWindows Library for

JavaScript

JavaScript

アプリのフレームワーク

JavaScript

Windows 8 の機能にアクセス

JavaScript

WinJS (Windows Library for JavaScript)~HTML5 アプリのフレームワーク~

WinJS 2.1

アプリのフレームワーク

クロスブラウザー/プラットフォーム

オープンソース

GitHub で公開中

WinJS の提供する機能リッチコントロール 内部処理

Promise モデル (非同期)

スケジューラー

XHR (HTTP リクエスト)

データバインド

バインドテンプレート

フラグメント

ナビゲーション

Try WinJS

WinJS の機能を体験するサイト

http://try.buildwinjs.com/

ユニバーサルアプリ~異なるデバイス用アプリのコード共有の仕組み~

Windows ストアアプリ

Windows Phone アプリ

コード

Web アプリ からWindows ストア アプリ、そしてユニバーサルアプリ

Windows ストア アプリからそしてニバーサルアプリ

マルチ デバイスハイブリット アプリ

マルチデバイスハイブリットアプリ~ iOS、Android 向けのアプリを開発~

•Windows 8.1

•Visual Studio 2013

•Professional

•Ultimate

•Premium

マルチデバイスハイブリットアプリ~ iOS、Android 向けのアプリを開発~

CSS | HTMLJavaScript | TypeScript

iOS

Multi-Device Hybrid Apps

Update 2

マルチデバイスハイブリットアプリが提供する機能

~シームレスな開発環境構築とデバッグ機能~

デバッグ

> 4.4 : 〇

< 4.4 : ×

iOS : ×

• Android 4+

• iOS 6 & 7

ターゲット

ビルド

iOS : ×

: 〇

“ ” コード補完

エミュレーター

: 〇

iOS :〇(※) Apache Ripple

(※1) Windows は 8.0 のみ

(※2) iOS アプリのビルドには Mac が必要

• HTML5 + JavaScript でクロスプラットフォーム開発を可能に

• PhoneGap

CORDOVA アプリの構造

Web ビュー

オペレーティングシステム

コンテンツ

API

API

プラグインプラグイン

ネイティブ呼び出し

JavaScript

Visual Studio 2013 のアドインMulti-Device Hybrid Apps を使用した、クロスプラットフォームで動作するHTML5 アプリの開発

2013 ♥

まとめ

iOS

L♥ve is always with you.

資料 1/2

• Microsoft Visual Studio 2013 Update 2• http://www.microsoft.com/en-

us/download/details.aspx?id=42666

• Multi-Device Hybrid Apps (Preview)http://msdn.microsoft.com/en-us/vstudio/dn722381

資料 2/2

• Visual Studio 2013 Update 2 でのHTML5 関連の強化点• http://blogs.msdn.com/b/osamum/archive/2014/06/12/visual-

studio-2013-update-2-html5.aspx

top related