What’s New in ASP.NET 4.5 Ori Calvo, 2012 John Bryce Hi-Tech College

Objectives Part 1 - ASP.NET Web Forms 4.5 Part 2 - IDE Enhancements Part 3 - ASP.NET MVC 4

Prerequisites ASP.NET Developer Good understanding of HTML and HTTP Good understanding of C# Language

Getting Started Install Visual Studio 11 Beta ◦ us us Some new features require Windows 8 Consumer Preview ◦ us/windows-8/download us/windows-8/download ◦ And then install Visual Studio 11

ASP.NET Web Forms 4.5 Strongly Typed Data Control Model Binding Unobtrusive validation HTML5 Updates Core Runtime and Framework ◦ Bundling and Minification ◦ Support for Web Sockets API

Strongly Typed Data Controls Still uses the syntax Uses a new “ItemType” attribute New syntax is supported under a web control template ◦ Item ◦ BindItem IntelliSense works !!! Invoking a method is supported

Model Binding New data binding mechanism A data bound control can specify ◦ Select/Update/Insert/Delete methods Method’s parameters are automatically bound to control state ◦ Can bind parameters to other value providers Validation is supported through DataAnnotation

Is it MVVM? New model binding makes ASP.NET feels like an MVVM framework ◦ Each control is bound to an ItemType (A.K.A ViewModel) Use AutoMapper to switch between Model and ViewModel Can it be testable too? ◦ See my blog: 012/02/22/asp-net-web-forms-and-mvvm.aspx 012/02/22/asp-net-web-forms-and-mvvm.aspx

KnockoutJS Open Source project developed by Steve Sanderson An MVVM library Can bind HTML elements to a JavaScript ViewModel Install through NuGet

ASP.NET Web API “Stop looking at HTTP through the eyes of WCF” More control over HTTP Simplifying configuration More testability Multiple formats on a single service OData support

Bundling and Minification Must be enabled at Application_Start Can bundle a whole directory ◦ Alphabetical order  ◦ Known libraries are moved to top ◦ Can be customized ◦ Minification can be skipped Consider a NuGet package named “Cassette” ◦

Web Sockets Bi-directional, full-duplex communication channel Over a single TCP socket Requires implementation by both web server and web browsers ◦ IIS 8 ◦ IE 10 See sample

Small Improvements HTML Encoded Data-Binding ◦ Use <%#: ◦ More secured ◦ Not the default Unobtrusive Validation ◦ Cleaner page ◦ Small page HTML5 Updates ◦ TextBox.TextMode new values ◦ FileUpload supports multiple files

IDE Enhancements HTML Editor JavaScript Editor CSS Editor Page Inspector Publishing IIS Express

HTML Editor Smart Tasks inside source view New HTML5 snippets Extract to user control IntelliSense inside attributes Automatic renaming of matching tag Event Handler generation Smart indentation Auto reduce statement completion Refactoring effects markup too

JavaScript Editor Code outlining Brace Matching Go to definition Implicit references DOM IntelliSense

CSS Editor Hierarchical indentation Intellisense for CSS Hacks Ctrl+K,C Color picker Vendor specific prefixes Snippets for browser specific settings

Page Inspector Determine which server-side code has produced the HTML markup Install through Web Platform Installer Right click a file and select “View in Page Inspector” Renders web pages directly into visual studio Allows you to examine source code and HTML

More IDE Enhancements Browser chooser ◦ Multiple Image Thumbnails

ASP.NET MVC – Brief Overview ViewControllerRouting System Extensibility Partial ViewActionRouteModel Metadata HTML HelperFilterRoute HandlerValue Provider Inline Template Model StateConstraintModel Binder RazorMethod Selector Temp Data Provider View BagTemp DataDependency Resolver View EngineAction Result

ASP.NET MVC 4 New Project Templates Better Mobile Support Display Modes and View Switcher Recipes Task Support for Asynchronous Controllers

Project Templates Default Project Template ◦ Modern looking ◦ Richer UI through jQuery UI dialog ◦ Adaptive Rendering Mobile ◦ Incorporate jQuery Mobile scripts Single Page Application ◦ Integrates upshot & Knockout ◦ Come to next session Web API

Better Mobile Support Adaptive Rendering Display Modes View Switcher Mobile Template Project

Display Modes Useful when adding mobile support for existing web site ◦ Install-Package jQuery.Mobile.MVC Allows view/layout selection depending on the browser Can override current browser “User Agent String” ◦ Can be used to implement a “View Switcher” Can register custom display modes

JQM – Server vs. Client centric JQM can be used for both type of application The challenge is to create a real Mobile/Web application ◦ Need to preload all application views ◦ Views should be filled by client code  KnockoutJS ◦ What if server is down?  HTML5 Offline Web Applications

Summary ASP.NET Web Forms ◦ New data binding mechanism ASP.NET MVC 4 ◦ Better mobile support Visual Studio ◦ Better JavaScript development support ◦ Lots of nice/small improvements

Read more Course 1373 at John Bryce

Thank You !!!