Windows Azure - 今やるWindows ストアLOB アプリ開発のための設計手法

Presentation on theme: "Windows Azure - 今やるWindows ストアLOB アプリ開発のための設計手法"— Presentation transcript:

1 Windows Azure - 今やるWindows ストアLOB アプリ開発のための設計手法
4/9/2017 Enterprise Windows 8 開発 - 今やるWindows ストアLOB アプリ開発のための設計手法 中田 光昭 シニアコンサルタント 日本マイクロソフト株式会社 鈴木 章太郎 テクニカルエバンジェリスト 日本マイクロソフト株式会社 © 2011 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.

2 新しい時代の Microsoft の Vision - Devices + Services
今までも、これからもひき続き 「ひと」中心のコンピューティング実現のために

3 Visual Studio Live! Las Vegas 2011MGB 2003
本日お持ち帰りいただきたいこと Windows ストア LOB アプリに求められるもの MVVM（Model-View-ViewModel）の考え方 社内外のデータソースの選択肢とその利用方法 Windows Azure 連携 アプリ開発の方法 © 2003 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

4 Visual Studio Live! Las Vegas 2011MGB 2003
アジェンダ Windows ストア LOB アプリに　求められるもの Model-View-ViewModel の考え方 データソースの選択肢とその適用 Windows Azure 連携 Windows 　　ストア LOB アプリ開発と展開 まとめ © 2003 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

5 Windows ストア LOB アプリに 求められるもの

6 Windows アプリの分類 Windows ストアアプリ デスクトップアプリケーション Windows ストアアプリ デスクトップアプリ
WinRT APIs JavaScript C , C++ C# , VB XAML HTML / CSS Win32 .NET Silverlight Internet Explorer C , C++ C# , VB XAML HTML JavaScript

7 ストアアプリの企業導入に伴う課題 既存アプリケーション との住み分け 開発リソース確保、 技術研修 アプリケーション化 のターゲット
配布の方法

8 百貨店の店舗用商品カタログのフロー例 XML-RPC アプリケーションサーバー 商品情報を検索 マスター情報を検索 Web サービス
マスターデータサーバー REST Web サービス 画像 URLを含む商品情報を取得 7:37 AM マスター 情報を取得 画像 URL を検索 REST SharePoint Site search Browse Page Site Actions username Parent > Parent > Current Page Page Title This Site: site Libraries Site Pages Shared Documents Drop Off Library Custom library Current Page Page One Page Two 画像マスターサーバー (SharePoint) 画像情報を リクエスト 画像 URL を取得 画像情報を 返す

9 Visual Studio Live! Las Vegas 2011MGB 2003
データソースとしての選択肢の選定 データベースとの接続 （特に SQL Server） 社内の コンテンツ サーバー クラウド上のコンテンツ　サーバー クラウドや 公開された サービスとの連携 WCF Data Services SharePoint Server 2010/2013 Office 365 ASP.NET Web API、Mobile Services © 2003 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

10 ストアアプリ Grid テンプレートや MVVM (Model-View-ViewModel) の利用
階層型ページ遷移で画面を活用 ユーザーに適切な情報を提供 画面に必要な　　　コンテンツのみ　表示 MVVM の積極的採用 Hub Section Details Contoso Travel Featured destinations Last minute deals 7 night Alaska Cruise Last Minute Deals Barcelona, Spain 7 Night Alaska Cruise Picture windows with ocean and port views Upgrade from an inside cabin and save $43/night/person! Ocean View Cabins From $2,099 — only $150/night/person based on double occupancy Suites From $2,099 — only $150/night/person do Picture windows with ocean and port view My Trips Weather 7 days Chicago (3/11 – 3/19) 54/43 Mostly Sunny Today Attractions Featured Destinations Top Destinations for 2012 City Guide Windows ストアアプリ Grid テンプレート MVVM (Model-View-ViewModel）サンプル実装

11 Windows ストア LOB アプリ適用シナリオ
Visual Studio Live! Las Vegas 2011MGB 2003 Windows ストア LOB アプリ適用シナリオ 文書 画像 添付ファイル SharePoint Server 2010 文書 画像 添付ファイル Office 365/Share Point 2013 11 Windows Azure Websites BLOB SQL Database ユーザー ユーザー © 2003 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

12 MVVM (Model-View-ViewModel）の考え方

13 Visual Studio Live! Las Vegas 2011MGB 2003
MVVM とは デザイナー担当 開発者が担当 View ViewModel Model UI、XAML ロジック、状態 データソース アーキテクチャーパターン John Gossman（WPF チーム）により提唱 MVC パターンのバリエーション Martin Fowler の “Presentation Model pattern” に類似 XAML のデータバインディングとコマンディングを基礎に稼働 ViewModel はこれら２つを結合 ・View は ViewModel のプロパティにバインド可能 ・ ViewModel は View から使えるようにModel の再定義が可能 ・View は ViewModel を知り、ViewModel も Model を知るが、その逆はなし © 2003 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

14 Adventure Works RI のご紹介
Visual Studio Live! Las Vegas 2011MGB 2003 Adventure Works RI のご紹介 CodePlex に公開された MVVM フレームワーク Prism 4.5 の一部を利用 C# / XAML に特化 Windows ストア LOB アプリ開発のために最適化 設定・検索チャーム 各フレームへの遷移 バリデーション その他順次追加予定 © 2003 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

15 Demo Windows Store Business Apps Guidance using Prism for Windows Runtime

16 Visual Studio Live! Las Vegas 2011MGB 2003
MVVM のメリット 関心の分離ができる メンテナンスしやすくなる Code 内を可視化しやすい View 変更に影響受けない テストしやすくなる 単体テスト、XAML 活用 C#/XAML フレームワーク 　自体が MVVM をサポート データバインディング/ INotifyPropertyChanged /データコンテキスト/Observable パターン Data Model View XAML 分離コード View Model State + Operations Change Notification Data-binding and commands 関心の分離ができる メンテナンスしやすくなる Model は View が変更されても変更する必要がない ViewModel もView の変更に伴いめったに変更する必要がない どこに何があるか Code を見つけやすい テストしやすくなる ViewModel は分離コードより単体テストがしやすい XAML の役割を増やし、分離コードの量を減らすことができる フレームワーク自体が MVVM をサポート可能 データバインディング/データコンテキスト/Observable パターン © 2003 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

17 MVVM のデメリット 標準モデルは存在しない シンプルな UI には MVVM はオーバースペック 多くのコードが必要
Grid テンプレート自体、独自の “MVVM” モデルを持つ シンプルな UI には MVVM はオーバースペック 多くのコードが必要 INotifyPropertyChanged Grid テンプレートの BindableBase Commands 等 Data Model View XAML 分離コード View Model State + Operations Change Notification Data-binding and commands

18 Grid テンプレートにおける MVVM \Common\ BindableBase.cs
INotifyPropertyChanged を実装 データバインドで使用するデータクラスの基底クラス BindableBase を継承したデータモデル 実際に表示するデータはここで定義される データの定義、読み込み動作などのサンプルが記述されている \DataModel SampleDataModel.cs バインディングで使用するデータモデルの サンプル

19 社内外のデータソースの選択肢とその利用方法
① SharePoint Server 2010

20 SharePoint Server 2010 連携シナリオ
社内ニュース配信 各種社内ニュースを表示 カテゴリー別ニュースを表示 ニュース詳細を表示 スタートスクリーンに 最新ニュースを表示

21 アーキテクチャ概要 SharePointリスト、ドキュメントライブラリを利用してクライアントへニュースを配信 Web デスクトップ アプリ
SharePoint Server アップロード ニュース 画像 添付ファイル 管理者 Web デスクトップ アプリ ユーザー ニュース登録ツール

22 Demo WinRT App with SharePoint Server 2010 for Microsoft Store

23 社内外のデータソースの選択肢とその利用方法
② Office 365/SharePoint 2013

24 Office 365/SharePoint 2013 連携シナリオ
商品カタログ配信 各種社内ニュースを表示 カテゴリー別ニュースを表示 ニュース詳細を表示 スタートスクリーンに 最新ニュースを表示

25 アーキテクチャ概要 SharePointリスト、ドキュメントライブラリを利用してクライアントへ商品カタログを配信 Web デスクトップ
SharePoint Online アップロード メタ情報 画像 管理者 Web デスクトップ アプリ ユーザー ニュース登録ツール

26 Demo WinRT App with Office 365/SharePoint 2013 for Microsoft Store

27 Windows Azure 連携 Windows ストア LOB アプリ開発

28 Windows Azure 連携シナリオ オンライン楽器ストアアプリ スタートスクリーン 全商品表示（Hub）
一覧・登録（Sections） 個別商品表示・編集（Details） 各商品を表示 タイトルを編集 詳細情報編集、削除可能

29 アーキテクチャー概要 Windows ストアアプリ ・店舗管理者用 - 編集・登録 Windows Azure
サイド ローディング 店舗 管理者 一般 ユーザー Grid テンプレート Windows Azure　　　　　　　 Websites Windows Azure Web サイト Entity Framework Get/Post/ Put/Delete ASP.NET Web API REST Code First JSON Entity Framework ドメイン モデル Windows ストア 29 Windows ストアアプリ ・店舗管理者用 - 編集・登録 ・一般ユーザー用 - 閲覧・購入・ 　　プッシュ通知（Mobile Services）・ 　　メール（SendGrid) Windows Azure Storage (BLOB) 画像 Windows Azure SQL Database 文字 数値 SQL Database Entity Framework/CodeFirst でデータベースを構成 SQL Database に商品詳細情報（文字・数値データ）、Windows Azure ストレージ（BLOB）に画像を登録 ASP.NET Web API で REST サービスを作成・公開 Windows Azure Websites でサービスをホスト Windows ストアアプリから商品情報を登録・編集 Windows Azure

30 Demo WinRT App with Windows Azure as a Musical Instruments Shop

31 まとめ

32 まとめ Windows ストア LOB アプリに求められるもの MVVM（Model-View-ViewModel）の考え方
社内外のデータソースの選択肢とその利用方法 Windows Azure 連携 アプリ開発の方法

33 リソース Windows ストア アプリ開発用テンプレート Windows アプリ アートギャラリー Adventure Works RI
Windows アプリ アートギャラリー Adventure Works RI SharePoint Online/Windows Azure 開発関連技術情報 ストア LOB アプリ/Windows Azure 開発関連技術情報

34 Visual Studio Live! Las Vegas 2011MGB 2003
(株)デジタル アドバンテージ主催、 日本マイクロソフト(株) 他 エンジニアリング企業協賛 Not “How-to” コンセプトは、 ハイ・レベルで Hot なテーマをわかりやすく ! (アーキテクト向) 本日、コンテンツ公開開始 ! 6月8日(土) キックオフ・イベント実施予定 © 2003 Microsoft Corporation. All rights reserved. This presentation is for informational purposes only. Microsoft makes no warranties, express or implied, in this summary.

35 4/9/2017 5:14 PM © 2013 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION. © 2010 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries. The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.