---
title: Vs2013 multi device shosuz
tags: 
author: [Shotaro Suzuki](https://convert.docswell.com/user/shosuz)
site: [Docswell](https://www.docswell.com/)
thumbnail: https://bcdn.docswell.com/page/K742R6R3J1.jpg?width=480
description: Vs2013 multi device shosuz by Shotaro Suzuki
published: November 12, 13
canonical: https://convert.docswell.com/s/shosuz/KLLGGD-vs2013-multi-device-shosuz
---
# Page. 1

![Page Image](https://bcdn.docswell.com/page/K742R6R3J1.jpg)

マルチデバイス環境における
バックエンドサービスの共通化と
クライアントアプリの実装
鈴木 章太郎
テクニカルエバンジェリスト
日本マイクロソフト株式会社
http://blogs.msdn.com/b/shosuz/


# Page. 2

![Page Image](https://bcdn.docswell.com/page/LJ1MQVQZEG.jpg)

テクニカルエバンジェリスト
http://blogs.msdn.com/b/shosuz
MTC アーキテクト
http://www.microsoft.com/ja-jp/business/mtc/ads.aspx
呟きネタは主に、Windows、Windows Azure、
Windows Phone, RIA, HTML5, MVVM,
iOS/Android x Windows Azure 連携, Guitar … 等
ASPIC 執行役員 (‘04 ~)
Wipse モバイル x クラウド部会長（’11 ~)
2005-2012 早稲田大学大学院非常勤講師、
2008-2010 中央大学非常勤講師、
2013- 東京工業大学非常勤講師
Microsoft 軽音楽部広報担当（Guitar/Keyboard）


# Page. 3

![Page Image](https://bcdn.docswell.com/page/GJW3MLM6J2.jpg)






# Page. 4

![Page Image](https://bcdn.docswell.com/page/4EZVQMQRJ3.jpg)







# Page. 5

![Page Image](https://bcdn.docswell.com/page/Y7656N61EV.jpg)

マルチデバイス活用の背景と
Devices + Services


# Page. 6

![Page Image](https://bcdn.docswell.com/page/G75Y656L74.jpg)

Devices
Services


# Page. 7

![Page Image](https://bcdn.docswell.com/page/9J2GMNM3JR.jpg)

仕事と
プライベート
の曖昧な境界
モバイル
デバイスの浸透
デジタル世代
技術的知識
の向上
マルチ
デバイス
求められる
スピード
7


# Page. 8

![Page Image](https://bcdn.docswell.com/page/DEYVXPX8EM.jpg)

デバイスの爆発的増加


# Page. 9

![Page Image](https://bcdn.docswell.com/page/VJNM151978.jpg)

デバイスの多様性


# Page. 10

![Page Image](https://bcdn.docswell.com/page/YE9N5Y53E3.jpg)

コンシューマの動向
Minutes on Web
Minutes on Apps
Dec 2010
Jun 2011
Source: Flurry, ComScore, Alexa
Datasource: 総務省 通信利用動向調査(世帯編) 平成23年度報告書
http://www.soumu.go.jp/johotsusintokei/statistics/statistics05.html
Dec 2011


# Page. 11

![Page Image](https://bcdn.docswell.com/page/GE8KY6YL7D.jpg)

IT 管理者および経営層が考える
タブレットの利用用途
最も多い利用用途
接客、営業支援のためのプレゼンテーション
今後、必要な仕様
①
②
③
④
業務に特化したアプリ(LOB)
通信回線
位置情報(GPS)
セキュリティ
OS への期待 (右グラフ)
20%
Windows 8
38%
Windows 7
12%
iPad
Android
TM
14%
OSは気にしない
16%
TM
出典: IDC 「 2013 年 国内法人タブレット市場 利用実態調査：Windows 8 タブレ ットを含めたビジネス機会と 2013 年～2017 年の予測」(2013年6月)


# Page. 12

![Page Image](https://bcdn.docswell.com/page/LELZ494QJR.jpg)






# Page. 13

![Page Image](https://bcdn.docswell.com/page/4JMVKZZKJW.jpg)

13


# Page. 14

![Page Image](https://bcdn.docswell.com/page/PJR2X666E9.jpg)

JavaScript


# Page. 15

![Page Image](https://bcdn.docswell.com/page/PEXD6MMD7X.jpg)

Web ブラウザ
Windows 8
iOS
HTML/JavaScript
Android
デバイスネイティブアプリ [*]
•
•
•
HTML/JavaScript
C#/VB+XAML
C++ + XAML
•
Objective-C
•
Java
メリット
•
•
リーチの獲得
配置が容易
•
•
高い操作性
ハードウェア機能の利用
デメリット
•
操作性やハードウェア利用がブ
ラウザ機能に限定
ブラウザの互換性
•
•
アプリとOSとの対応
デバイスへのアプリの配置
•
[*] タブレットアプリとしての比較のため、Windows は WinRT Apps とする
[*] ネイティブアプリを構築するミドルウェアとして、Unity, PhoneGap, Titanium 等がある


# Page. 16

![Page Image](https://bcdn.docswell.com/page/3EKX1GGD7D.jpg)

リーチ獲得/容易な配置の Web アプリ
コンシューマ向けのネイティブアプリ
タブレット業務のためのネイティブアプリ
Web ブラウザ
Windows 8
iOS
Android
HTML/JavaScript
デバイスネイティブアプリ
•
•
•
HTML/JavaScript
C#/VB+XAML
C++ + XAML
•
Objective-C
•
Java


# Page. 17

![Page Image](https://bcdn.docswell.com/page/L735QNNPE5.jpg)

17


# Page. 18

![Page Image](https://bcdn.docswell.com/page/87DD9WW37G.jpg)

ASP.NET Web API
Windows Azure
Mobile Services


# Page. 19

![Page Image](https://bcdn.docswell.com/page/VJPXZ99P78.jpg)

ASP.NET Web API


# Page. 20

![Page Image](https://bcdn.docswell.com/page/2EVLWMMVJQ.jpg)

・スーパーマーケットのタイムセールを管理する Windows ストアアプリ
・バックエンドサービスは Windows サーバーでも Windows Azure でもほぼ同じコードで配置可能
バックエンドサービス作成
Web サイト
（Localhost）
Windows ストアアプリ
Get/Post/
Put/Delete
Internet Information
Server (IIS)
XAML / C#
JSON
Code
First
Windows ストアアプリの作成
Data Adapter の作成
Grid View 追加
XAML 編集による画面作成
アプリバー、CRUD 処理実装
共有コントラクト実装
Entity Framework
Grid View
バックエンドサービス作成
データモデル作成とデータベース生成
テストプロジェクトの作成とデータの作成
SQL Server
Express
文字・数値
データ


# Page. 21

![Page Image](https://bcdn.docswell.com/page/57GXDGG1EL.jpg)



問題領域の概念的な
エンティティやリレーションの定義
マッピング (MSL)


両モデル間の対応付け
ストレージモデル (SSDL)




特定のデータソースに基づく
論理スキーマのモデル
Entity
SQL
概念モデルのエンティティと
オブジェクトとの間でマッピング
Entity Data Model
概念モデル (CSDL)
プログラム上の
オブジェクト


# Page. 22

![Page Image](https://bcdn.docswell.com/page/4EQ81XXNJP.jpg)

プレゼンテーション層



ドメイン層

データ層
RDB
public partial class Entry
{
public virtual int ID
{
get;
set;
}


# Page. 23

![Page Image](https://bcdn.docswell.com/page/KJ42R663E1.jpg)






Web サーバー
データソース
アプリ
サービス
Get/Post/
Put/Delete
ブラウザー
JSON/XML
ASP.NET
Web API
Entity
Framework



クライアント


# Page. 24

![Page Image](https://bcdn.docswell.com/page/LE1MQVVZ7G.jpg)

Web ブラウザー及び
デスクトップアプリケーションからの
ASP.NET Web API の利用
DEMO


# Page. 25

![Page Image](https://bcdn.docswell.com/page/GEW3MLL6E2.jpg)








# Page. 26

![Page Image](https://bcdn.docswell.com/page/47ZVQMMRE3.jpg)

 リモートデータ
 WCF エンドポイント（SOAP / REST)
 従前どおり サービス参照の追加で可能
 OData（REST）
 WCF Data Services で公開（REST, XML/JSON 等ペイロード選択可能）
 ASP.NET Web API で公開（REST, JSON）
 Windows Azure Mobile Services（REST, JSON）
 ローカルデータ
 IsolatedStorage  Windows.Storage, FilePicker
 SQLite


# Page. 27

![Page Image](https://bcdn.docswell.com/page/YJ656NN17V.jpg)


XAML / C#


Get/Post/
Put/Delete
JSON
ASP.NET
Web API
var client = new HttpClient();
HttpClient
HttpResponseMessage response =
await client.GetAsync(“サービスのURI&quot;);
 await
var result =
await
response.Content.ReadAsStringAsync();
var pictures = JsonArray.Parse(result);
// JSONの結果をオブジェクトにバインド …



# Page. 28

![Page Image](https://bcdn.docswell.com/page/GJ5Y655LJ4.jpg)

Windows 8.1ストアアプリからの
ASP.NET Web API の利用
DEMO


# Page. 29

![Page Image](https://bcdn.docswell.com/page/9E2GMNN3ER.jpg)

Windows Azure
Mobile Services


# Page. 30

![Page Image](https://bcdn.docswell.com/page/D7YVXPP87M.jpg)

Windows Azure Mobile Services = MBaaS
Windows 8 SDK、Windows Phone 8 SDK、
iOS SDK、Android SDK, HTML5 SDK
ネイティブ SDK
Mobile Services
API
認証
データ
ロジック
Push
スケジューラ


# Page. 31

![Page Image](https://bcdn.docswell.com/page/VENM1559J8.jpg)

Mobile Services の内実
 データアクセス、
プッシュ通知、
認証サポート
Windows 8、Windows Phone 8 SDK、
iOS SDK、Android SDK, HTML5 SDK
 強力なサーバーサイド
スクリプトのサポート
プッシュ通知、バリデーション、
プリプロセッシング、
ポストプロセッシング、
他の Web サービスとの連携


# Page. 32

![Page Image](https://bcdn.docswell.com/page/Y79N5YY373.jpg)

サーバースクリプトリファレンス
http://msdn.microsoft.com/en-us/library/windowsazure/jj554226.aspx


# Page. 33

![Page Image](https://bcdn.docswell.com/page/G78KY66LJD.jpg)

様々な高度なクエリーが実行可能
posts : 読み取り (JavaScript)
function read(query, user, request) {
query.orderByDescending(&#039;id&#039;);
request.execute({ success:
function(results) {
if (results.length === 0) {
request.respond();
return;
}
var postIds = [];
results.forEach(function(p){
postIds.push(p.id);
});
var sql=
&quot;SELECT posttags.postId, tags. id,
tags.name
FROM posttags,tags
WHERE posttags.postId IN
(&quot;;
sql += postIds.join(&quot;,&quot;);
sql += &quot;)
AND posttags.tagId = tags.id&quot;;
console.log(sql);
……


# Page. 34

![Page Image](https://bcdn.docswell.com/page/L7LZ499QER.jpg)

認証
 Microsoft Account、Twitter、
Facebook、Google ID 等
 各 CRUD 操作のテーブルレベルの
アクセス許可
iOS
http://www.windowsazure.com/jajp/develop/mobile/tutorials/get-started-withusers-ios/
Android
http://www.windowsazure.com/jajp/develop/mobile/tutorials/get-started-withusers-android/
・すべてのユーザー
・アプリケーション キーを持つユーザー
・認証されたユーザーのみ
・スクリプトと管理者のみ
 サーバー側スクリプトを使用した
よりきめ細かい制御
HTML5
http://www.windowsazure.com/jajp/develop/mobile/tutorials/get-started-withusers-html/


# Page. 35

![Page Image](https://bcdn.docswell.com/page/4EMVKZVKEW.jpg)

Live Connect ポータル
https://account.live.com/developers/applications/index
Windows ストアアプリポータル
http://msdn.microsoft.com/ja-JP/windows/apps


# Page. 36

![Page Image](https://bcdn.docswell.com/page/PER2X62679.jpg)



# Page. 37

![Page Image](https://bcdn.docswell.com/page/P7XD6MDDJX.jpg)

1. チャネル URI を要求
2. クラウド サービスに
登録
3. 認証とプッシュ通知


# Page. 38

![Page Image](https://bcdn.docswell.com/page/37KX1GXDJD.jpg)

Mobile Services in 中古楽器店ストアアプリ
http://blogs.msdn.com/b/shosuz/
サイド
ローディング
Windows ストアアプリ
・店舗管理者用 - 編集・登録
Windows
ストア
・一般ユーザー用 - 閲覧・購入・
プッシュ通知・メール (Mobile Services)
38
Entity
Framework
一般
ユーザー
ASP.NET Web API
REST
JSON
Windows Azure
Storage (BLOB)
画像
ドメイン
モデル
Code
First
Grid
テンプレート
Get/Post/
Put/Delete
Entity
Framework
店舗
管理者
Azure
WindowsWindows
Azure
Web サイトWebsites
Windows Azure
SQL Database
文字
数値
SQL Database
Windows Azure


# Page. 39

![Page Image](https://bcdn.docswell.com/page/LJ35QN5P75.jpg)



# Page. 40

![Page Image](https://bcdn.docswell.com/page/8JDD9WD3JG.jpg)

Visual Studio 2013 による
Windows Azure Mobile Services
超高速開発
DEMO


# Page. 41

![Page Image](https://bcdn.docswell.com/page/VEPXZ9XPJ8.jpg)

41


# Page. 42

![Page Image](https://bcdn.docswell.com/page/27VLWMLVEQ.jpg)

42


# Page. 43

![Page Image](https://bcdn.docswell.com/page/5JGXDGX17L.jpg)

 まとめ
NEED IMAGE HERE
(original keeps crashing ppt)
 クラウド時代のマルチデバイス対応の
業務アプリを展開するための
バックエンドサービスは簡単に作れる
 クライアントアプリとして ブラウザー
（PC、スマートフォン）及びWindows
8.1 ビジネスストアアプリ等、順次追加
可能


# Page. 44

![Page Image](https://bcdn.docswell.com/page/47Q81X8NEP.jpg)

© 2013 Microsoft Corporation. All rights reserved.
This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.
このプレゼンテーションは、情報提供のみを目的としています。 Microsoft は、この概要について、明示または暗示を問わず、いかなる保証も行いません。


