Windows 8 アプリとデータベース/サービスとの連携 – ③ Windows ストア アプリとの連携(C#/XAML)

皆様、こんにちは! 引き続き、9/2(火) タッチ/ペン対応アプリの開発とクラウドを活用した既存サービスとの接続方法のセミナーでの、私が担当したセッション ”Windows 8 アプリでのデータベース/サービスとの接続 “ の詳細情報とコードにつき、ご紹介していきたいと思います。最後にリソースとしてソースコードの置場等を入れてあります。 Windows ストアアプリの追加と Data Adapter の作成 次に、このタイムセール商品情報アプリケーションのソリューションに、Windows ストアアプリを追加してみましょう。最初に、DataAdapter を作成します。これは、この前に作成した、TimeSalesApp Web API にアクセスするための呼び出しのHttpclient クラスとなります。 ストアアプリの追加 TimeSaleソリューションを右クリックし、追加→新しいプロジェクトを選択します。新しいプロジェクトダイアログボックスで、左側のテンプレートを展開し、Visual C#の Windows ストアアプリを選択し、右側の、新しいアプリケーション(XAML)を選択します。次のように指定してください。 ・種類:新しいアプリケーション(XAML)(Visual C#) ・場所:他のTimeSaleプロジェクトと同じソリューションフォルダ ・プロジェクト名:TimeSaleStoreApp プロジェクトを追加したら、まずはローカルマシンで実行します。黒い画面が立ち上がったらいったんアプリを落とし、Visual Studio に戻ってデバッグを停止します。このときのMainPage.xaml 画面は使わずに削除して、その後、新しい画面を追加します。 TimeSaleStoreApp プロジェクトを右クリックし、追加→新しい項目を選択し、基本ページを選択して、名前を、MainPage.xaml として追加、をクリックします。 この時に、このようなダイアログボックスが出ますので、はい、を選んで追加します。 ※ これをしないと画面遷移等に必要な共通ファイル群(Commonフォルダ配下)が作成されないので注意してください。この共通ファイル群が必要です。 ProductWithPriceをリンクとして追加 まず、TimeSale クラスライブラリの中の ProductwithPrice.cs クラスを参照できるようにします。ソリューションエクスプローラーでプロジェクト TimeSaleStoreApp を右クリックし、追加→既存の項目、を選択します。そして、TimeSale フォルダにある ProductwithPrice.cs ファイルを選択し、リンクとして追加、を選択します。 Json.NET のインストール ついで、Json.NET のインストールを行います。Json.NETは、ProductWithPriceデータクラスのインスタンスと、JSONの相互変換処理をするためのライブラリです。こちらは、NuGet から取得できます。これを使うのはWindows 8/8.1…

3

Windows 8 アプリとデータベース/サービスとの連携 – ② バックエンド Web サービス作成

皆様、こんにちは! 引き続き、9/2(火) タッチ/ペン対応アプリの開発とクラウドを活用した既存サービスとの接続方法のセミナーでの、私が担当したセッション ”Windows 8 アプリでのデータベース/サービスとの接続 “ の詳細情報とコードにつき、ご紹介していきたいと思います。 Web サービス作成とデータ公開 Windows ストアアプリからリモートデータを使用するためには、なんらかの REST または SOAP サービスが公開されている必要があります。ASP.NET Web APIは、ASP.NET MVC 4からサポートされたHTTPによるリクエストを受けるRESTfulなサービスです。このサンプルでは、ASP.NET Web API を使って、Windows ストアアプリから基本的なデータ操作ができるようなサービスを作成します。 当該ソリューションを右クリックし、新しいプロジェクトの追加、を選択しクリックします。Web テンプレートから、ASP.NET Web Application を選択し、名前を適当につけ(ここでは RestService)、OK ボタンをクリックします。   次に出てくるダイアログボックスで、Web API を選択し、OKをクリックします。 ※ この図を見て戴くとお分かりの通り、Windows Azure の箇所で、クラウド内のホストにチェックが入っていますが、ここではまだクラウドには発行しないので、チェックを外しておいてください。 これで、RestService の初期のスケルトンが作成されます。ここでいったんソリューションのビルドを行ってください。 コントローラーの実装 次に、このプロジェクトからTimeSale プロジェクトに参照設定を追加し、次いで、コントローラーを実装します。RESTService プロジェクトのController フォルダーを右クリック->追加->コントローラーを選択します。 スキャフォールディングの追加からEntity Framework を使用したアクションがあるWeb API 2コントローラーを選んで、 コントローラー名は、TimeAppSaleController という名前にして、データコンテキストには自動的にTimeSaleAppContextが入っているのを確認して、モデルクラスからは、ProductWithPriceを選びます。コントローラー名の下の”非同期コントローラーアクションを使用します”にチェックを入れて、OK をクリックします。 そうすると、下記のコントローラーが自動生成されます。…


Windows 8 アプリとデータベース/サービスとの連携 – ① データモデル作成とデータベース生成

皆様、こんにちは!今期(7月以降)初めての投稿となります。今年もよろしくお願いします! 9/2(火) タッチ/ペン対応アプリの開発とクラウドを活用した既存サービスとの接続方法のセミナーにご参加いただきました皆様、お忙しいところありがとうございました。今後も、皆様の関心のあるテーマを中心にセミナーの企画とセッションのご提供をして行きたいと考えていますので、今後ともよろしくお願いします。 さて、早速、お約束した通り、私が担当しましたこのセッションの詳細情報とコードにつき、ご紹介していきたいと思います。 概要 Windows ストアアプリからデータベースへの連携を行う場合には、直接のデータ連携はできず、Web サービス経由で行う必要があります。ここでは、SQL Server Express Edition 上に生成されたデータベースを、ASP.NET Web APIから、REST インターフェースとJSON形式のペイロードを使用して公開し、それをWindows ストアアプリから利用するシナリオをご紹介します。 ADO.NET Entity Framework 5.0以降で実装された、Code First の機能を使い、Visual Studio 上のソースコードをビルドすることにより、SQL Server Express Edition 上に、各カラムの属性やリレーションシップ等のメタ情報を含めつつデータベースを生成することが可能です。また、Migration 機能により、カラムの追加等のデータベースへの変更を、データに影響を与えることなく行うことが可能です。ここで出来上がったデータベースを、ASP.NET Web API を使い、REST のインターフェースで公開します。 ここでは、商品管理用のWindows ストアアプリを実装します。これらの機能を実現するために、SQL Server Express Edition 、ADO.NET Entity Framework 6.0、Code First、ASP.NET Web API、そして Windows ストアアプリのテンプレートの各技術の基本的な使い方をご紹介します。 このエントリは、① バックエンドサービス作成 ① -1 データモデル作成とデータベース生成について、ご紹介します。 必要なソフトウェア他 · Microsoft…


5/29-30 de:code セッション SV-007 “パワフル モバイル アプリ開発 ~ 最新 Microsoft Azure Mobile Services をフル活用しよう!~ ” フォローアップ (1)

皆様、こんにちは!de:code では多くの皆様に参加いただき誠に有難うございました。セッション内でもお約束しました通り、さっそく、セッションフォローアップしていきたいと思っています。 詳細は、ビデオが出てからということになりますが、今回は概要と、ASP.NET Web API バックエンドのところの解説をしたいと思います。 全体像 セッションでもご紹介した通り、これがMobile Services の全体像です。クライアントはほぼすべてのクライアントに、ネイティブで対応、HTML5クライアントももちろんあります。データベースは、SQL Azure Database 以外に、Azure Table Storage、Azure Blob Storage、それにOSS で MongoDBがくわわりました。Hybrid Connections というところは、BizTalk を介して様々なデータベースが連携できます。 ASP.NET Web API バックエンド これまでの Mobile Services は、Node.js バックエンドのみでしたので、クライアントで定義されたクラスから渡された JSON のデータは、そのまま、ダイナミックにスキーマが構成されて、3列あるDBであれば3列に構成されました。そのイメージはこちらです。 1: public class Favorites 2: { 3: public string Id { get; set; } 4:  5: [JsonProperty(PropertyName = "text")] 6: public string…


Microsoft Project Siena:ビジネスユーザーが Windows ビジネスストアアプリ開発可能に

皆様、本日は予定を変更して、Microsoft Project Siena について書かせてください。 Project Siena Microsoft Project Siena はベータリリースの Windowsストアアプリです。ビジネスエキスパート、ビジネスアナリスト、コンサルタント、その他のアプリケーション利用者のために設計されました。 ノンプログラミングで、パワフルなデバイス&サービスの世界を実現できるアプリで、今日のビジネスプロセスの変革にインパクトを与えるものといえるでしょう。 シナリオとしては、流通、医療、金融、製造、通信・メディア、公共、等々あらゆるインダストリーで使えると思います。まずはこちらのビデオを見てみてください。 https://aka.ms/ProjectSiena 機能 HTML5/JavaScriptで開発されたWindows8/8.1用ストアアプリ 開発者はツールを使って機能拡張が可能 アプリのコンセプト作り、検証、そして作成のプロセスをドキュメントづくりのように簡単に行える 社内外のデータやWebのデータに簡単にアクセスできる(SharePoint リスト, Excel、Azure tables、RSS フィード、他の RESTful サービス、Windows Azure Mobile Services 、ASP.NET Web API等々) リッチでインタラクティブなビジュアルを使ったユーザーにとって特別なアプリを作成できる Excelのような表現力でビジネスロジックとインテリジェンスを付加できる 自分だけでも世界中の同僚とアプリをシェアしても利用できる 画面のデザインは簡単に変更でき、デザイン、データ、ふるまいの変更も簡単 最初は空白のキャンバスからスタート 多くのビジュアル要素を使用したアプリ開発が可能 スクリーン間の移動が簡単にできるようにトップアップバ―生成可能、マルチスクリーン化も可能 様々なデータソースからアプリにデータを追加可能 ドロップダウンメニューからもキャンバスからも画面のスイッチが可能 Excelのような表現力とカスタムロジックをアプリに追加可能 ペン、カメラ、マイク等のコントロールを使って簡単に拡張機能をアプリに追加可能   以上です。サンプルはまた別のエントリでご紹介予定です。 それではまた! 鈴木章太郎


Developing a Windows Store business app using C#, XAML, and Prism for the Windows Runtime、P&Pページ及び書籍として公開!

皆様こんにちは! 表題の件、先日4/24のMicrosoft Architect Forum 、それに5/11のCommunity Open Day でご紹介したものですが、正式にPatterns & Practices の一シリーズとして、製本され、ページも公開されました。 http://msdn.microsoft.com/en-us/library/windows/apps/xx130643.aspx こちら今後少しずつLOBアプリの実装のための参考ガイドとして、ご紹介していければ、と思っています。 取り急ぎ、先日のCommunity Open Day でご紹介した内容をさらに進化させた内容として、メインの担当者のFrancisが、VS Toolbox で喋っている動画をご覧ください。今後、このBlog中で、コードの解説やサンプルの解説を詳細に行えれば、と思っていますので、ご期待くださいませ。   どうぞよろしくお願いします!! 鈴木 章太郎


Microsoft Architect Forum、Enterprise Windows 8 開発セッションフォローアップ Part 4

皆様、こんにちは!さてPart 4、遅くなりすみません。 Part 1~Part 3ではWindows ストアアプリとWindows Azure連携デモにつき書きます。Part 1では主に今回のデモで使用された技術の基本的な使い方、Part 2では実際の実装コード(店舗管理者用ストアアプ側)、Part 3では一般ユーザー用ストアアプリ側(Mobile Services)、そしてPart 4で、Office 365およびSharePointとの連携のコード、についてご説明します。今回は、Part 4について解説します。 1.セッションスライドについて こちらに公開してあります。 http://www.slideshare.net/shosuz/maf2013-enterprise-windows-8-architecture-for-rapid-development-of-windows-store-lob-apps  MAF2013 Enterprise Windows 8 – Architecture for rapid development of WinRT apps from Shotaro Suzuki   2.デモについて Part 1~Part 3では、Windows Azure 連携アプリ(2種類)をご紹介しました。Part4 では、SharePoint /O365 連携シナリオについて、ご紹介します。デモはこのようなものでした。     (1) SharePointのListに登録したニュースをストアアプリに配信 このようなアプリでした。 SharePointのListに登録したニュースを配信する、Read のみ(Create/Update/Deleteなし)のアプリです。早期導入でまずはこのような形で導入を求められることも多々あります。Listは下記の通り、実際にSharePoint上で今まで通り登録・編集等を行います。 Model MVVM(Model-View-ViewModel)の構成にしてあるので、Model のフォルダから見ていきます。この中に、Repositry.cs ファイルを配置し、ここで、SharePointからデータを取ってくるロジックを格納しています。 最初に、プログラム内で使う定数や変数を作成しておきます。 private…

3

「Windows ストア lob アプリ開発のためのガイダンスとフレームワークのご紹介」in Community Open Day 2013、ご来場誠に有難うございました!

昨日5/11、SGTセミナールームAにて表題のセッションを担当させて戴きました。このセッション、ランチ時のセッションだったんですが、殆どご飯を食べる人もおられなくて(というかもう食べ終わられていたのかw?)、皆さん本当に真剣に聞いて戴き、誠に有難うございました。Ustreamもアーカイブされているかと思いますので、ご興味ある方はこちからどうぞ。 Video streaming by Ustream http://www.ustream.tv/recorded/32676467 スライドシェアにスライドも上げてありますので、こちらからDLください。 Windows ストア lob アプリ開発のためのガイダンスとフレームワークのご紹介 rev from Shotaro Suzuki いつもはVisual Studioのコードエディタですべてご紹介するのですが、今回は、スライドにコードを大量に書して共有しました。これは理由がありまして、MVVM(Model-View-ViewModel)がメインということもあり、様々なフォルダを行き来して中身をスクロールしながら見て戴くよりは、まずはコードそれ自体を見て戴こうという趣旨がありましたためです。 追って、このブログにソリューションファイルのリンクは張りますので、そちらを見て戴ければ足りますしね。そんなわけで、50分にしては異例の70枚というスライドになっているわけです。 ぜひ、こちらを活用して戴き、Windows ストア LOB アプリ開発のみならず、通常のアプリ開発にも役立てて戴ければ!と思います。 今後も継続的にテクニカルセッションやデモ等ではこれを使ってご紹介していく予定ですので、お楽しみに! 鈴木 章太郎


Microsoft Architect Forum、Enterprise Windows 8 開発セッションフォローアップ Part 3

皆様、こんにちは! Part 1~Part 3ではWindows ストアアプリとWindows Azure連携デモにつき書きます。Part 1では主に今回のデモで使用された技術の基本的な使い方、Part 2では実際の実装コード(店舗管理者用ストアアプ側)、Part 3では一般ユーザー用ストアアプリ側(Mobile Services)、そしてPart 4で、Office 365およびSharePointとの連携のコード、について書く予定です。 今回は、Part 3について解説します。 1.セッションスライドについて こちらに公開してあります。 http://www.slideshare.net/shosuz/maf2013-enterprise-windows-8-architecture-for-rapid-development-of-windows-store-lob-apps  MAF2013 Enterprise Windows 8 – Architecture for rapid development of WinRT apps from Shotaro Suzuki   2.デモについて Part1 ~ Part 3 では、Windows Azure連携シナリオである、”オンライン楽器ストアプリ”について、ご紹介します。このようなアプリでした。   アーキテクチャー概要はこちらです。 店舗管理者用のアプリは、Entity Framework/CodeFirst でデータベースを構成し、SQL Database に商品詳細情報(文字・数値データ)、Windows Azure ストレージ(BLOB)に画像を登録します。そして、ASP.NET Web API で REST サービスを作成・公開し、Windows Azure…