http://aka.ms/chack

 Web アプリケーション開発のトレンドを再考する
 One ASP.NET の今を整理する
 ASP.NET のこれからを知る
セッションのゴール
Session Takeaways

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





Microsoft <3 jQuery

• 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, 2012
by Scott Hanselman

One ASP.NET Vision

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 Single Page Application (SPA)
SPA

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/

Katana Project
Helios
Katana Architecture
OWIN









Summary of ASP.NET vNext
www.asp.net/vnext : github.com/aspnet










Compatibility of ASP.NET vNext










Community Technology Preview

.NET の新しいアプローチ
New Approach to building .NET

モダン Web と ASP.NET のこれから
Modern Web and ASP.NET vNext
エディターや
開発ツールの選択
オープンソースへの貢献 クロス プラットフォームOSS
クラウドへ
シームレスな移行
迅速な開発サイクルモジュール化
パフォーマンス向上

.NET Technologies Primer
.NET 開発テクノロジ入門 2014 年版
～ Visual Studio 2013 対応版 ～
http://nkbp.jp/1sT87tP
著者
小高 太郎、酒井 達明、芝村 達郎
中原 幹雄、山田 祥寛、和田 健司
監修
日本マイクロソフト株式会社 エバンジェリストチーム

.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 Binding knockoutjs.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