Web アプリケーション パターンの進化 ~ One ASP.NET の今と...
Transcript of Web アプリケーション パターンの進化 ~ One ASP.NET の今と...
Evolution of Web Application Patterns
サービス
デバイス+
+
次世代型のパターン(Emerging Patterns)
サーバー
クライアント
従来型のパターン(Established Patterns)
HTML5 and Modern Web Browsers
HTML5/CSS3 の登場 (+ ECMAScript 5)
対応 Web ブラウザーの普及 (モダン Web ブラウザー)
jQuery のデファクトスタンダード
各種 JavaScript ライブラリ / フレームワークの普及
従来型 Web アプリケーション
次世代型 Web アプリケーション
(Established)
(Emerging)
Single Page Application Architecture
クライアント サーバー
ASP.NET
REST
JSON
XML
HTML
View Model
HTTP
View
Async
Web API
• NuGet (ぬげっと / にゅーげっと)
– オープンソース ライブラリなどのパッケージ管理の仕組み(インストール、更新、配布)
– Visual Studio で標準採用
– NuGet ギャラリーを利用したパッケージの公開が可能
http://nuget.org/
"More and more of ASP.NET is open source. We want to make ASP.NET more pluggable, more open, more fun."
"We've got big things planned - some that will surprise you."
February 25, 2012by Scott Hanselman
Visual Studio 2013 Update 2 ダウンロード
One ASP.NET and Web Tools 2013.2
One ASP.NET
ASP.NET MVC 5.1.2
ASP.NET Web API 2.1 (5.1.2)
ASP.NET Web Pages 3.1.2
ASP.NET Identity 2.0.0
ASP.NET SignalR 2.0.2
Entity Framework 6.1
Visual Studio
JSON エディター
LESS/SASS エディター
Azure Web Sites/VM 作成
ブラウザーリンク
NuGet 2.8
TypeScript 1.0.1
Web Forms vs. MVC
Web フォーム
豊富なサーバー コントロール
イベント駆動型プログラミング
ASP.NET MVC
HTML ベースの UI 開発
Model-View-Controller パターン
D & D 配置容易な UI 開発
Web 標準志向テスト駆動開発
Extension for Visual Studio Web Tools
Web Essentials :
http://vswebessentials.com/
Framework for HTTP Services
RESTful HTTP サービス構築のためのフレームワーク
ASP.NET プロジェクトテンプレートの一部として提供
URL ルーティング
モデルバインディング
スキャフォールディング
OData クエリパラメータ
ASP.NET SPA Project Template
サーバー
Web UI
ASP.NET MVC 5
認証 Services
ASP.NET Web API 2
Entity Framework 6
HTML/CSS/JS
JSON
クライアント
/Home/Index
knockout
jQuery
bootstrap
/Home/Index
/Token
/api/Account/…
knockoutjs.com
<span data-bind="text: msg"></span>
http://angularjs.org/
<span>{{msg}}</span>
Real Time Web Application Library
リアルタイム・非同期・双方向通信ライブラリ
NuGet パッケージとして提供
ASP.NETアプリ
SignalRハブ JavaScript / .NET
アプリ
SignalRハブ Proxyリアルタイム
通信サーバークライアント
OWIN = Open Web Interface for .NET
Katana Project http://katanaproject.codeplex.com/
Helios
New Approach to building .NET http://owin.org/
Summary of ASP.NET vNext
www.asp.net/vnext : github.com/aspnet
モダン Web と ASP.NET のこれからModern Web and ASP.NET vNext
エディターや開発ツールの選択
オープンソースへの貢献 クロスプラットフォームOSS
クラウドへシームレスな移行
迅速な開発サイクルモジュール化
パフォーマンス向上
.NET Technologies Primer
.NET 開発テクノロジ入門 2014 年版
~ Visual Studio 2013 対応版~
http://nkbp.jp/1sT87tP
著者
小高太郎、酒井達明、芝村達郎
中原幹雄、山田祥寛、和田健司
監修
日本マイクロソフト株式会社エバンジェリストチーム
!! 日経 BP 社様ブースにて 10% 割引で先行販売中 !!
.NET Foundation for Openness
.NET API for Hadoop WebClient
.NET Compiler Platform ("Roslyn").NET Map Reduce API for Hadoop
.NET Micro Framework
ASP.NET MVC
ASP.NET Web API
ASP.NET Web Pages
ASP.NET SignalR
Composition (MEF2)
Entity Framework
Linq to Hive
MEF (Managed Extensibility Framework)
OWIN Authentication Middleware
Rx (Reactive Extensions)
Web Protection Library
Windows Azure .NET SDK
Windows Phone Toolkit
WnsRecipe
Mimekit Xamarin.Auth
Xamarin.Mobile
Couchbase for .NET
http://www.dotnetfoundation.org@dotnetfdn // #dotnetfdn
Mailkit
System.Drawing
JavaScript Library for Data Bindingknockoutjs.com
<p>First name: <input data-bind="value: firstName" /></p><p>Last name: <input data-bind="value: lastName" /></p><p>Full name: <span data-bind="text: fullName"></span></p>
var ViewModel = function(firstName, lastName) {this.firstName = ko.observable(firstName);this.lastName = ko.observable(lastName);this.fullName = ko.computed(function() {
return this.firstName() + " " + this.lastName();}, this);
};ko.applyBindings(new ViewModel("Akira, "Inoue"));
HTML enhanced for web apps http://angularjs.org/
var msgController = angular.module(msgController ', []);
msgController.controller(msgController ', ['$scope', function ($scope) {$scope.msg = "Hello";
}]);
<body ng-controller="msgController"><span>{{msg}}</span>
</body>
Bootstrap http://getbootstrap.com/
http://bootswatch.com/
Twitter Bootstrap with ASP.NET
Web Forms vs. MVC
Web フォーム ASP.NET MVC
主な技術スキルイベント駆動型プログラミング(VB6.0/Win フォームなどと同様)
C# / VB / .NET
Web 技術全般(HTML, JavaScript, Ajax など)
C# / VB / .NET
MVC デザイン パターン
アプリの特徴
Web サーバー コントロールの活用
機能、生産性重視
デスクトップ Web ブラウザー向け
JavaScript ライブラリを活用
パフォーマンス、デザイン重視
マルチデバイス, モバイル向け
移行の容易性 VB6.0/Win フォームからの移行Static HTML ページや
Classic ASP からの移行
http://www.asp.net/
http://www.microsoftvirtualacademy.com/training-courses/733552de-3921-4cca-8834-3e34ecedb9ab
http://www.microsoftvirtualacademy.com/training-courses/developing-asp-net-mvc-4-web-applications-
jump-start-japanese
http://channel9.msdn.com/Series/Building-Modern-Web-Apps
http://www.asp.net/aspnet/overview/owin-and-katana/an-overview-of-project-katana
http://blogs.msdn.com/b/webdev/archive/2014/02/18/introducing-asp-net-project-helios.aspx
Resources
https://github.com/aspnet
ASP.NET vNext
Introducing ASP.NET vNext
ASP.NET vNext Overview
Introducing the future of .NET on the server
Deep Dive the future of .NET on the server
Channel 9 Live: ASP.NET Developer Q&A
Resources for ASP.NET vNext
アンケートにご協力ください。
●アンケートの「Breakout Session」記入欄に、上記の【Session ID】を
ご記入ください。
●アンケートはお帰りの際に、受付でご提出ください。
マイクロソフトスペシャルグッズと引換えさせていただきます。
Ask the Speaker のご案内 Ask the Speaker
展示会場MAP
●本セッションの詳細は、展示会場内
『Ask the Speaker』コーナー
Room B カウンタにてご説明させて
いただきます。是非、お立ち寄りください。