.Net技術でこれからも食べていくための技術戦略

1,406 views

Published on

エフスタ!!SENDAI 2(MVP Community Camp 2014 - Tohoku)

Published in: Technology
0 Comments
7 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,406
On SlideShare
0
From Embeds
0
Number of Embeds
48
Actions
Shares
0
Downloads
9
Comments
0
Likes
7
Embeds 0
No embeds

No notes for slide

.Net技術でこれからも食べていくための技術戦略

  1. 1. .NET技術で これからも食べていくための 技術戦略 グレープシティ株式会社 製品戦略室 プリンシパルエンジニア 八巻 雄哉 Twitter @yamaki00
  2. 2. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) ビジネスアプリケーション向け.NETテクノロジガイド  Microsoft .NET ホーム http://www.microsoft.com/ja-jp/net/
  3. 3. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Established(従来型)とEmerging(次世代型)  Establishedアプリケーションパターン  クライアント/サーバー方式などのテクノロジパターンを使用して 開発されたアプリケーションや、デスクトップブラウザーに 最適化された Webアプリケーションの開発に用いる技術パターン。 基盤アプリケーションとして機能するもので、既存のビジネス プロセスに大きな比重を置いて設計されています。  Emergingアプリケーションパターン  マルチデバイスやクラウドといった新しいテクノロジで実現される アプリケーション。アプリケーションをエンドユーザー中心に 拡張することで、Establishedパターンを補完します。
  4. 4. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) 『英和辞書 - goo辞書』より  established【形】 1. 〈秩序・慣習などが〉確立した[された], 既定 の;(慣習的に)認められた;立証済みの;〈法 律などが〉制定された 2. 〈地位・人が〉常設の, 常勤の. 3. 〈宗教・教会が〉国教の. 4. 〈人・動植物が〉(新しい土地に)定住[定着] した.  emerging【形】  発展段階の;新出現の
  5. 5. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) .NETエンジニアの状況は?
  6. 6. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) .NET開発者中心 読者調査レポート 0% 10% 20% 30% 40% 50% 60% 70% Silverlight ASP.NET MVC ASP.NET Webフォーム WPF Windowsフォーム 2011年9月 2012年9月
  7. 7. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) EmergingとEstablishedの関係 モダンビジネスアプリケーション 従来型のアプリケーション パターン
  8. 8. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) モダンな業務アプリへ  現行の開発技術はestablishedパターンに深く依存して いるため、モダンなアプリに必要とされるemergingパ ターンとの統合は簡単ではありません。  マイクロソフトプラットフォームは既存アプリケーショ ンに基づいて構築されており、emergingアプリケー ションパターンへの拡張を可能にします。また、複数の 開発テクノロジがサポートされるため、開発者のスキル や、既存アプリケーションで使用されているテクノロジ に応じ、最適な方法を選ぶことができます。
  9. 9. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) 本日ご紹介する技術トピック ポータブルクラスライブラリ ASP.NET Web API シングルページアプリケーション ディスプレイモード
  10. 10. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) ポータブルクラスライブラリ
  11. 11. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) .NET Framework Silverlight Windows Phone Windows ストア アプリ用 .NET Xbox 360 Xamarin.Android Xamarin.iOS ポータブルクラスライブラリ  上記のプラットフォームで参照できるマネージアセンブリ  コードを最大限に再利用し、必要なプロジェクトの数を削減  同じコードベースを共有するマルチターゲットアプリで効果的
  12. 12. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) サポートされている機能 機能 .NET Framework Windows ストア Silverlight Windows Phone Xamarin コア ✅ ✅ ✅ ✅ ✅ LINQ ✅ ✅ ✅ ✅ ✅ IQueryable ✅ ✅ ✅ 7.5以上 ✅ Dynamic キーワード 4.5 のみ ✅ ✅ ✅ MEF (Managed Extensibility Framework) ✅ ✅ ✅ ✅ Network Class Library (NCL) ✅ ✅ ✅ ✅ ✅ シリアル化 ✅ ✅ ✅ ✅ ✅ WCF ✅ ✅ ✅ ✅ ✅ Model-View-View Model (MVVM) 4.5 のみ ✅ ✅ ✅ ✅ データ アノテーション 4.0.3以上 ✅ ✅ ✅ XLINQ 4.0.3以上 ✅ ✅ ✅ ✅ System.Numerics ✅ ✅ ✅ ✅
  13. 13. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Demo1 MSDNライブラリ Model-View-View Model を利用した汎用性のあるクラス ライブラリの使用
  14. 14. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) MVVMのイメージ図 View ViewModel Model
  15. 15. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) ASP.NET Web API
  16. 16. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) ASP.NET Web API  RESTfulなサービスを提供するのに適した HTTPサービス構築用のフレームワーク  HTTPメソッドの「GET」「POST」「DELETE」「PUT」 を使ってリソースを操作  リソースとは「Web上に存在する名前を持った ありとあらゆる情報」  リソースはそれぞれ固有のURIを持つ メソッド 役割 GET リソースの取得 POST リソースの新規作成 PUT 既存のリソースのアップデート DELETE リソースの削除
  17. 17. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Demo2
  18. 18. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Microsoft ASP.NET Web API 2.1 Client
  19. 19. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) 振り返り デスクトップ アプリ(WPF) Windowsストア アプリ ViewModelと Model (ポータブル クラスライブラリ) XAML C#/VisualBasic クライアント側 サーバー側
  20. 20. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) デスクトップアプリ (WPF) Windowsストアアプリ 振り返り
  21. 21. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) グレープシティのソリューション
  22. 22. Desktop Packシリーズ 44%OFF 42%OFF
  23. 23. ComponentOne Studio for WinRT XAML
  24. 24. MultTouch for Windows Forms 1.0J
  25. 25. 各Windowsフォーム製品でのタッチ対応
  26. 26. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) シングルページアプリケーション
  27. 27. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) シングルページアプリケーション(SPA)  クライアントサイドのアーキテクチャに重点をおいた 設計アプローチ  その名の通り、 1つのページで完全に動作する Webアプリ  ページ全体の更新や再読み込みなし  アプリケーションプログラムのほとんどは クライアントサイドで実行され、Webブラウザーと サーバーのやり取りは必要なデータの交換のみ
  28. 28. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) One ASP.NET
  29. 29. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Single Page Application テンプレート
  30. 30. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) ASP.NETシングルページアプリケーション構成 JSON/XML クライアント サーバー Knockout
  31. 31. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Knockout UIに必要なのは ViewModel (シンプルなモデルオブジェ クト) とデータバインドだけ。ややこしいDOM操作なし で、動的なインターフェイスを作ることができます。 ViewModel のプロパティが変更されると、自動的にUI の関連付けられた部分を更新します。 データの結合や変換を実現するためのデータ間の関係 チェーンを暗黙的に設定します。 幾重にもネストされたテンプレートも、バインドされた ViewModel を用いて素早くUIを生成します。 宣言型バインディング UIの自動更新 依存関係のトラッキング UIテンプレート オープンソースのJavaScript MVVMライブラリ Knockout.jsの概要 // Speaker Deck https://speakerdeck.com/mayuki/knockout-dot-jsfalsegai-yao
  32. 32. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Knockoutjs.com - Hello World Example - jsFiddle
  33. 33. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Demo3
  34. 34. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) 振り返り デスクトップ アプリ(WPF) Windowsストア アプリ PC向け Webアプリ ViewModelと Model (ポータブル クラスライブラリ) ViewModelと Model HTML/CSS XAML C#/VisualBasic JavaScript クライアント側 サーバー側
  35. 35. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) グレープシティのソリューション
  36. 36. ウ ィ ジ モ
  37. 37.  jQuery UIベースのUIウィジェット集  40種類以上のウィジェットであらゆるUIをカバー  20種類以上のテーマが用意され、ThemeRoller サポート  ブラウザはjQuery 1.xとjQuery Mobileのサポートに準拠  日本語のドキュメント、日本語による技術サポートを提供  GNU GPLv3と商用ライセンスのデュアルライセンス  Knockout統合ライブラリを収録し、 Knockoutとシームレスに統合 ウ ィ ジ モ
  38. 38. ウ ェ ブ グ イ Windowsフォームと同様の開発手法で、 モダンなWebアプリを開発する (シングルページアプリケーション) ASP.NETベースのフレームワーク
  39. 39. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) ディスプレイモード
  40. 40. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) ディスプレイモード  ブラウザからやってくるリクエストを見て、 対応するテンプレートファイルの切り替えを 行う機能 デスクトップブラウザから「/Home」へアクセス →「ViewsHomeIndex.cshtml」が使用される モバイルブラウザから「/Home」へアクセス →「ViewsHomeIndex.Mobile.cshtml」が使用される
  41. 41. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) デフォルトで”Mobile”はサポート  “Mobile”のディスプレイモードは デフォルトで入っている  IsMobileDeviceプロパティがTrueのブラウザは ”Mobile”が使用される  C:WindowsMicrosoft.NETFramework[.NET version]ConfigBrowsers  カスタムのディスプレイモードを定義したい場合 は、DisplayModeProviderクラスにモードを追加
  42. 42. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) Demo4
  43. 43. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) グレープシティのソリューション
  44. 44.  アダプティブウィジェット  モバイル Web アプリケーションと非モバイル Web アプリケーションの 両方で使用できる  jQuery UI 参照ではなく jQuery Mobile 参照を使用する  スクリプトでウィジェットを初期化する代わりに、 マークアップで data-role 属性を使用して ウィジェットを作成する ウ ィ ジ モ
  45. 45. ウ ェ ブ グ イ サービスパック1で モバイル向けページの作成に対応予定
  46. 46. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) まとめ デスクトップ アプリ(WPF) Windowsストア アプリ PC向け Webアプリ モバイル向け Webアプリ ViewModelと Model (ポータブル クラスライブラリ) ViewModelと Model HTML/CSS XAML C#/VisualBasic JavaScript クライアント側 サーバー側
  47. 47. エフスタ!!SENDAI 2 (MVP Community Camp 2014 – Tohoku) まとめ MVVM Java Script jQuery Knock out ASP.NET Web API PCL

×