VS2012 for Web DevelopersUgo LattanziMicrosoft MVP ASP.NET/IIS, MCP

Twitter: @imperugoBlog: http://tostring.itE-mail: imperugo@gmail.com

Agenda

• ASP.NET MVC/Webform• Web API• SignalR

WebStack

ASP.NET MVC 4What’s new!

New Release mode!

MVC 4, Web API, SignalR and so on are distribute by NuGet so you can update the packages directly into Visual Studio without download and install anything on your computer.

New Template

• HTML5 Template (semantic tags, media queries, etc);

• It’s responsive (PC, Tablet and smartphone landscape/portrait)

Async everywhere

Asynchronous operations• The async is available also for ASP.NET

• MVC/Webform/WebAPI supports async/await keywords for long running action (I/O, Web Requests and so on);

Asyn Controller

Bundle Minification

Bundle minification

Bundling and minification are two techniques you can use in ASP.NET 4.5 to improve request load time.  Bundling and minification improves load time by reducing the number of requests to the server and reducing the size of requested assets (such as CSS and JavaScript.)

Bundle minification

Using B/M Without B/M Change

File Requests 9 34 256%

KB Sent 3.26 11.92 266%

KB Received 388.51 530 36%

Load Time 510 ms 780 ms 53%

• Debug mode;• Reduce the number of requests;• Reduce the file size;• Custom Bundles;• CDN Support;• Directory Support;• LESS, CoffeeScript, SCSS, Sass Bundling

Bundle minification

Debug bundle

Create new js bundle

using System.Web.Optimization;

bundles.Add(new ScriptBundle("~/bundles/jquery").Include("~/Scripts/jquery-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryui").Include("~/Scripts/jquery-ui-{version}.js"));

bundles.Add(new ScriptBundle("~/bundles/jqueryval").Include("~/Scripts/jquery.unobtrusive*","~/Scripts/jquery.validate*"));

Create new css bundle

using System.Web.Optimization;

bundles.Add(new StyleBundle("~/Content/themes/base/css").Include("~/Content/themes/base/jquery.ui.core.css","~/Content/themes/base/jquery.ui.resizable.css","~/Content/themes/base/jquery.ui.selectable.css","~/Content/themes/base/jquery.ui.accordion.css","~/Content/themes/base/jquery.ui.autocomplete.css","~/Content/themes/base/jquery.ui.button.css","~/Content/themes/base/jquery.ui.theme.css"));

Custom Transformation

using System.Web.Optimization;

public class LessTransform : IBundleTransform{ public void Process(BundleContext context, BundleResponse response) { response.Content = dotless.Core.Less.Parse(response.Content); response.ContentType = "text/css"; }}

Mobile Support

Mobile support

• Mobile Template;• Device auto detect (mobile/desktop);• Support to mobile views (.mobile.cshtml);• Manual Check (Request.Browser.IsMobileDevice);• Override

HttpContext.SetOverriddenBrowser(BrowserOverride.Desktop);

Mobile support

DisplayModeProvider.Instance.Modes.Insert(0, newDefaultDisplayMode("iPhone"){ ContextCondition = (context => context.GetOverriddenUserAgent().IndexOf ("iPhone", StringComparison.OrdinalIgnoreCase) >= 0) });

Social Network

Social Network

• Enabling Logins from social networks (Facebook, Twitter, Google, LinkedIn, Live, Yahoo)

• Retrieve data after social login;• Easy to setup (just add your api key/secret into AuthConfig.cs)• Using DotNetOpenOAuth;

More and more

More stuff

• JSON.NET• Empty Project Template;• Azure SDK (1.6);• Database Migrations;• Add Controller to any project folder

Demo

Questions?

Web API

Web API and REST

When you speak about Web API, probably you should know REST, but was doesn it mean?

REST= REpresentational State Transfer

Web API

It is not a WebService, a patter or a protocol, but is a style of software architecture for

distributed systems such as the World Wide Web

Web API

ASP.NET Web API is a framework (FW 4.0) for processing data and returning data, tipically in json or xml (RESTful services);

It seems MVC but is not and, if you need both, use both.

What is similar to MVC?

• Released with NuGet;• Routing;• Controllers and Actions;• Filters;• ModelBindings;• Dependency Injection;

What is different from MVC?

• Dispatching (based on http verbs);• Formatters;• Async everywhere;• Self host (no need IIS);• Content negotiation;

• Everything is under System.Web.Http;

How does it work?public class ValuesController : ApiController{// GET api/valuespublic IEnumerable<string> Get(){return new string[] { "value1", "value2" };}

// GET api/values/5public string Get(int id){return "value";}}

// POST api/valuespublic void Post([FromBody]string value){}

// PUT api/values/5public void Put(int id, [FromBody]string value){}

// DELETE api/values/5public void Delete(int id){}}

Conventions

If you don’t like the conventions, don’t worry you can override using the attributes [HttpGet] and [NoAction]

Client

Into System.Web.Http (assembly Microsoft.AspNet.WebApi.Client) there is also a client.

HttpClient client = new HttpClient();var requestUrl = new Uri("http://api.mysite.com/something");var response = client.GetStringAsync(requestUrl);

Errors handling

• By default the response in 500;• You can manage differently in a single response, or writing a

different default behavior.

Errors handling• By default the response in 500;• You can manage differently in a single response, or writing a

different default behavior.

public string Get(int id){ if(id<1) throw new HttpResponseException(HttpStatusCode.NotFound);

//DO SOMETHING return "value";}

Content Negotiation

• The response format depends from the client;• You can add custom formatters for the response, out of the box

json and xml are supported;

Demo

Questions?

SignalR

SignalR

Async signaling library for .NET to help build real-time, multi-user interactive web applications ( aka persistent connection abstraction for .NET);

Install-Package SignalR;Install-Package SignalR.SampleMIT License

SignalR

• Web Sockets (several fallback like «forever frame» and «Long polling»);

• Different clients (JS, Silverlight, Window8, WPF, Windows Phone);

super-Demo

Questions?

THANKS

© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, and other product names are or may be registered trademarks and/or trademarks in the U.S. and/or other countries.The information herein is for informational purposes only and represents the current view of Microsoft Corporation as of the date of this presentation. Because Microsoft must respond to changing market conditions, it should not be interpreted to be a commitment on the part of Microsoft, and Microsoft cannot guarantee the accuracy of any information provided after the date of this presentation. MICROSOFT MAKES NO WARRANTIES, EXPRESS, IMPLIED OR STATUTORY, AS TO THE INFORMATION IN THIS PRESENTATION.