Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

32
Microsoft / web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway

Transcript of Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Page 1: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Building Web Apps with ASP.NET Jump Start

Scott HanselmanJon Galloway

Page 2: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Principal Program Manager, MicrosoftWeb developer focused on Windows Azure and ASP.NETBlogging at http://hanselman.com for over a decade

One of Microsoft’s Most Respected DevelopersWritten a number of books and spoken in person to almost a half million developers worldwidehttp://hanselminutes.com for tech talkhttp://thisdeveloperslife.com on developers’ lives and loveshttp://ratchetandthegeek.com for pop culture and tech media

Meet Scott Hanselman | @shanselman

Page 3: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Windows Azure Technical Evangelist Focused on ASP.NET MVChttp://weblogs.asp.net/jgalloway Web development on Microsoft platform since late '90sEx-submariner; Showcase Showdown winner “Price is Right”

Popular Author and Conference SpeakerWrox Professional MVC 4; MVC Music Store tutorialVirtual ASP.NET MVC Conference (mvcConf)First Web Camps World Tour in 2010Herding Code podcast (http://herdingcode.com)

Meet Jon Galloway | @jongalloway

Page 4: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

ASP.NET Program ManagerFocused on ASP.NET Core, Web Forms and SignalRhttp://twitter.com/damianedwards Australian trapped in SeattleWorked for an Ambulance company!Invented SignalR with David Fowler, and created WebFormsMVP

Conference SpeakerTechEd, BUILD, DevConnections and more!And a lovely billiards player

Damian Edwards | @damianedwards

Page 5: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

First Half Second Half

(01) What’s New in ASP.NET 4.5 (60 mins)

** MEAL BREAK **

(02) Building and Deploying Websites with ASP.NET MVC 4 (60 mins)

(06) Building and Leveraging Social Services in ASP.NET (30 mins)

(03) Creating HTML5 Applications with jQuery (60 mins)

(07) Building for the Mobile Web (60 mins)

(04) Building a Service Layer with ASP.NET Web API (30 mins)

(08) Real-time Communications with SignalR (45 mins)

(05) Leveraging your ASP.NET Development Skills to Build Office Apps (15 mins)

(09) Taking advantage of Windows Azure services (30 mins)

Building Web Apps with ASP.NET Jump Start

Page 6: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

• Target Audience• Experienced application developers interested in

leveraging ASP.NET and Visual Studio 2012 to offer modern apps that target modern browsers

• Suggested Prerequisites• At least six months of professional app dev experience• Previous Jump Starts:

Developing in HTML5 with JavaScript and CSS3Developing Windows Store Apps with HTML5

Building Web Apps with ASP.NET Jump Start

Page 7: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Microsoft Virtual AcademyFree online learning tailored for IT Pros and Developers Over 1M registered usersUp-to-date, relevant training on variety of Microsoft products

“Earn while you learn!” Get 50 MVA Points for this event!Visit http://aka.ms/MVA-Voucher Enter this code: ASPWebAppsJS (expires 3/8/2013)

Join the MVA Community!

Page 8: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Introduction: ASP.NET Foundations and Scenarios

Jon GallowayScott Hanselman

Page 9: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Module Overview

ASP.NET 4.5 Web FormsVisual Studio 2012 features for web devsBundling & Optimization

Page 10: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

The foundation: tools & frameworks

Visual Studio NuGet ASP.NET Windows

Azure

Page 11: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Visual Studio 2012: The editor for serious web devHTML5 / CSS3 standards and smarts

JavaScript language features

Page Inspector

One code editor for client and server

Web Essentials extension

Page 12: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

NuGet: The smart, easy way to manage dependencies

Find the latest release

Install and configure in your project

Handle dependencies and versions

Updates with dependency checking

Common list of installed packages

Simplified uninstalls

Streamlined deployment with Package Restore

Page 13: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

One ASP.NET: A Framework for us all

ASP.NET

WebForm

s

Sites

WebPages

Single Page Apps

MVC Web API

SignalR

Services

Page 14: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

ASP.NET and Web Tools 2012.2

Adds new project templates to Visual StudioNo changes to ASP.NET runtime, instead adds NuGet packagesLightweight install (<10 minutes, no reboot)

Download and information: http://asp.net/vnext

Page 15: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Deploying ASP.NET Apps to the Cloud

Windows Azure Web Sites (10 free!)Fast site creation and deploymentNothing new to learnEasy to scale

Page 16: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

The foundation: tools & frameworks

Visual Studio NuGet ASP.NET Windows

Azure

Page 17: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Taking it further: key scenarios

Visual Studio NuGet ASP.NET Windows

Azure

HTML5 HTTP Services

Apps for Office Mobile Social

Apps Realtime

Page 18: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

What’s New in ASP.NET 4.5

Jon GallowayScott Hanselman

Page 19: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

First Half Second Half

(01) What’s New in ASP.NET 4.5 (60 mins)

** MEAL BREAK **

(02) Building and Deploying Websites with ASP.NET MVC 4 (60 mins)

(06) Building and Leveraging Social Services in ASP.NET (30 mins)

(03) Creating HTML5 Applications with jQuery (60 mins)

(07) Building for the Mobile Web (60 mins)

(04) Building a Service Layer with ASP.NET Web API (30 mins)

(08) Real-time Communications with SignalR (45 mins)

(05) Leveraging your ASP.NET Development Skills to Build Office Apps (15 mins)

(09) Taking advantage of Windows Azure services (30 mins)

Building Web Apps with ASP.NET Jump Start

Page 20: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Moving towards a goal - One ASP.NET

ASP.NET

WebForm

s

Sites

WebPages

Single Page Apps

MVC Web API

SignalR

Services

Page 21: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Module Overview

Web Forms: Strongly Typed Data Controls

Web Forms: Model Binding

Friendly URLs

Page Inspector

Visual Studio web editor features

Web Essentials

Bundling & Optimization

Async everywhere! (BONUS!)

Page 22: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Model Binding with ASP.NET Web Forms:Strongly Typed Data Controls<ul>

<asp:Repeater ID="customersRepeater" runat="server" ItemType="WebFormsLab.Model.Customer"> </asp:Repeater></ul>

Step 1:Set the ItemType

<ul> <asp:Repeater ID="customersRepeater" runat="server“ ItemType="WebFormsLab.Model.Customer"> <ItemTemplate> <li> <a href="CustomerDetails.aspx?id=<%#: Item.Id %>"> <%#: Item.FirstName %> <%#: Item.LastName %> </a> </li> </ItemTemplate> </asp:Repeater></ul>

Step 2:Reference the properties as needed using the Item keyword

Page 23: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Web Forms: Model BindingGetting Data

<ul> <asp:Repeater ID="customersRepeater" runat="server" ItemType="WebFormsLab.Model.Customer"

SelectMethod="GetCustomers"> </asp:Repeater></ul>

Step 1:Set Select Method

public IQueryable<Customer> GetCustomers([Control]DateTime? createdSince){ IQueryable<Customer> query = _db.Customers;

if (createdSince.HasValue) { query = query.Where(

i => i.CreatedOn >= createdSince.Value); }

return query;}

Step 2:Get method returns IEnumerable or IQueryable

Page 24: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Web Forms: Model BindingInserting Data

<asp:FormView runat="server" ID="customerForm" InsertMethod="InsertCustomer" UpdateMethod="UpdateCustomer" <EditItemTemplate> <asp:Label runat="server" Text="Name:" AssociatedControlID="Name" /> <asp:TextBox runat="server" ID="Name" Text="<%# BindItem.Name %>" /> <!-- etc. -->

Step 1:Set Insert Method

public void InsertCustomer(){ var customer = new Customer();

TryUpdateModel(customer);

if (ModelState.IsValid) { _db.Customers.Add(customer); SaveChanges(customer); }}

Step 2:Use TryUpdateModel to validate, then save

Page 25: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Web Forms: Friendly URLs

public Album EditAlbum_GetItem([FriendlyUrlSegments] int? id)

{

return _db.Albums.Find(id);

}

/Album/Edit/1

\Album\Edit.aspxID passed to controls

Segments can be bound or accessed programmatically

Page 26: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Web FormsModel Binding & Friendly URLs,Mobile Supportdemo…

Page 27: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Bundling and Optimization

Web pages have many external references:CSS, Images, JavaScript

Page 28: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Bundling and Optimization

Bundling combines CSS and JavaScript requests

Page 29: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Bundling and Optimization

Minification compresses the files before sending

Page 30: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Microsoft /web

®

Visual Studio 2012 web dev features

Page Inspector

CSS and HTML editor

JavaScript editor

Web Essentials

Page 31: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

Visual Studio 2012 and Web Essentials

demo

Page 32: Microsoft /web ® Building Web Apps with ASP.NET Jump Start Scott Hanselman Jon Galloway.

© 2012 Microsoft Corporation. All rights reserved. Microsoft, Windows, Windows Vista 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.