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.

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

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.

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.

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

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

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

百貨店の店舗用商品カタログのフロー例 XML-RPC アプリケーションサーバー 商品情報を検索 マスター情報を検索 Web サービス マスターデータサーバー REST Web サービス 画像 URLを含む商品情報を取得 7:37 AM マスター 情報を取得 画像 URL を検索 REST SharePoint Site http://sharepoint/url 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 を取得 画像情報を 返す

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.

ストアアプリ 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）サンプル実装

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.

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

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.

Adventure Works RI のご紹介 Visual Studio Live! Las Vegas 2011MGB 2003 Adventure Works RI のご紹介 http://prismwindowsruntime.codeplex.com/ 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.

Demo Windows Store Business Apps Guidance using Prism for Windows Runtime http://prismwindowsruntime.codeplex.com

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.

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

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

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

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

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

Demo WinRT App with SharePoint Server 2010 for Microsoft Store

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

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

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

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

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

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

アーキテクチャー概要 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

Demo WinRT App with Windows Azure as a Musical Instruments Shop

まとめ

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

リソース Windows ストア アプリ開発用テンプレート Windows アプリ アートギャラリー Adventure Works RI http://msdn.microsoft.com/ja-jp/jj556277.aspx　 Windows アプリ アートギャラリー http://msdn.microsoft.com/ja-jp/hh544699 Adventure Works RI http://prismwindowsruntime.codeplex.com/ SharePoint Online/Windows Azure 開発関連技術情報 http://blogs.msdn.com/b/tsmatsuz/ ストア LOB アプリ/Windows Azure 開発関連技術情報 http://blogs.msdn.com/b/shosuz/

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.

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.