Asp.Net MVC Intro

Asp.Net MVC,[object Object],A new “pluggable” web framework,[object Object],Stefano Paluello,[object Object],stefano.paluello@pastesoft.com,[object Object],http://stefanopaluello.wordpress.com,[object Object],Twitter: @palutz,[object Object]

MVC and Asp.Net,[object Object],The Model, the View and the Controller (looks like “The Good, the Bad and the Ugly” ),[object Object],HtmlHelper and PartialView,[object Object],Routing,[object Object],Filters,[object Object],TDD with Asp.Net MVC,[object Object],Agenda,[object Object]

MVC and Asp.Net,[object Object],From WebForm to MVC,[object Object]

Asp.Net,[object Object],Asp.Net was introduced in 2002 (.Net 1.0),[object Object],It was a big improvement from the “spaghetti code” that came with Asp classic,[object Object],It introduced a new programming model, based on Events, Server-side Controls and “stateful” Form (Session, Cache, ViewState): the RAD/VB-like development model for the web.,[object Object],It allowed a lot of developers to deal with the Web, also if they have limited or no skills at all in HTML and JavaScript.,[object Object],Build with productivity in mind,[object Object]

Windows Form and Web Form models,[object Object],Server,[object Object],Reaction,[object Object],Code,[object Object],Action,[object Object],Server,[object Object],HttpRequest,[object Object],Serialize/,[object Object],Deserialize,[object Object],Webform state,[object Object],Code,[object Object],HttpResponse,[object Object]

Events and State management are not HTTP concepts (you need a quite big structure to manage them),[object Object],The page life cycle, with all the events handler, can become really complicated and also delicate (easy to break),[object Object],You have low control over the HTML code generated,[object Object],The complex Unique ID values for the server-side controls don’t fit well with Javascript functions,[object Object],There is a fake feeling of separation of concerns with the Asp.Net’s code behind,[object Object],Automated test could be challenging.,[object Object],That’s cool… But,[object Object]

Web standards,[object Object],HTTP,[object Object],CSS,[object Object],Javascript,[object Object],REST (Representational State Transfer), represents an application in terms of resources, instead of SOAP, the Asp.Net web service base technology,[object Object],Agile and TDD,[object Object],The Web development today is,[object Object]

So… Welcome, Asp.Net MVC,[object Object],WEB,[object Object]

Asp.Net MVC “tenets”,[object Object],Be extensible, maintainable and flexible,[object Object],Be testable,[object Object],Have a tight control over HTML and HTTP,[object Object],Use convention over configuration,[object Object],DRY: don’t repeat yourself,[object Object],Separation of concerns,[object Object]

The MVC pattern,[object Object]

Separation of concerns,[object Object],Separation of concerns comes naturally with MVC,[object Object],Controller knows how to handle a request, that a View exist, and how to use the Model (no more),[object Object],Model doesn’t know anything about a View,[object Object],View doesn’t know there is a Controller,[object Object]

Asp.Net > Asp.Net MVC,[object Object],Based on the .Net platform (quite straightforward  ),[object Object],Master page,[object Object],Forms authentication,[object Object],Membership and Role providers,[object Object],Profiles,[object Object],Internationalization,[object Object],Cache,[object Object],Asp.Net MVC is built on (the best part of) Asp.Net,[object Object]

Asp.Net and Asp.Net MVC run-time stack,[object Object]

Demo,[object Object],First Asp.NetMVC application,[object Object]

Asp.Net MVC,[object Object],The structure of the project,[object Object]

Asp.Net MVC projects have some top-level (and core) directories that you don’t need to setup in the config:,[object Object],Controllers, where you put the classes that handle the request,[object Object],Models, where you put the classes that deal with data,[object Object],Views, where you put the UI template files,[object Object],Scripts, where you put Javascript library files and scripts (.js),[object Object],Content, where you put CSS and image files, and so on,[object Object],App_Data, where you put data files,[object Object],Convention over configuration,[object Object]

Models, Controllers and Views,[object Object]

The Models,[object Object],Classes that represent your application data,[object Object],Contain all the business, validation, and data acccess logic required by your application,[object Object],Three different kind of Model: ,[object Object],data being posted on the Controller,[object Object],data being worked on in the View,[object Object],domain-specific entities from you business tier,[object Object],You can create your own Data Model leveraging the most recommend data access technologies,[object Object],The representation of our data,[object Object]

An actual Data Model using Entity Framework 4.0,[object Object]

ViewModel Pattern,[object Object],Additional layer to abstract the data for the Views from our business tier,[object Object],Can leverage the strongly typed View template features,[object Object],The Controller has to know how to translate from the business tier Entity to the ViewModel one,[object Object],Enable type safety, compile-time checking and Intellisense,[object Object],Useful specially in same complex scenarios,[object Object],Create a class tailored on our specific View scenarios,[object Object]

publicActionResultCustomer(int id),[object Object],{,[object Object],ViewData[“Customer”] = MyRepository.GetCustomerById(id);,[object Object],ViewData[“Orders”] = MyRepository.GetOrderforCustomer(id);,[object Object],return View();,[object Object],},[object Object],publicclassCustomerOrderMV,[object Object],{,[object Object],Customer CustomerData {get; set;},[object Object],Order CustomerOrders{ get; set;},[object Object],},[object Object],publicActionResult Customer(int id),[object Object],{,[object Object],CustomerOrderMVcustOrd = MyRepository.GetCustomerOrdersById(id);,[object Object],ViewData.Model = custOrd;,[object Object],return View();,[object Object],},[object Object],Model vs.ViewModel,[object Object]

Validation,[object Object],Validation and business rule logic are the keys for any application that work with data,[object Object],Schema validation comes quite free if you use OR/Ms,[object Object],Validation and Business Rule logic can be quite easy too using the Asp.Net MVC 2 Data Annotations validation attributes (actually these attributes were introduced as a part of the Asp.Net Dynamic Data),[object Object],Adding Validation Logic to the Models,[object Object]

[MetadataType(typeof(Blog_Validation))],[object Object],publicpartialclassBlog,[object Object],{,[object Object],},[object Object],[Bind(Exclude = "IdBlog")],[object Object],publicclassBlog_Validation,[object Object],{,[object Object], [Required(ErrorMessage= "Title required")],[object Object],[StringLength(50, ErrorMessage = "…")],[object Object],[DisplayName("Blog Title")],[object Object], publicString Title { get; set; },[object Object],[Required(ErrorMessage = "Blogger required")],[object Object],[StringLength(50, ErrorMessage = “…")],[object Object],publicString Blogger { get; set; }ù,[object Object],…,[object Object],},[object Object],Data Annotations validation,[object Object],How to add validation to the Model through Metadata,[object Object]

Demo,[object Object],Asp.Net MVC Models,[object Object]

The controllers are responsible for responding to the user request,[object Object],Have to implement at least the IController interface, but better if you use the ControllerBaseor the Controller abstract classes (with more API and resources, like the ControllerContext and the ViewData, to build your own Controller),[object Object],The Controllers,[object Object]

using System;,[object Object],usingSystem.Web.Routing;,[object Object],namespaceSystem.Web.Mvc,[object Object],{,[object Object],// Summary:Defines the methods that are required for a controller.,[object Object],publicinterfaceIController,[object Object], {,[object Object],// Summary: Executes the specified request context.,[object Object],// Parameters:,[object Object],// requestContext:The request context.,[object Object],void Execute(RequestContextrequestContext);,[object Object], },[object Object],},[object Object],usingSystem.Web;,[object Object],usingSystem.Web.Mvc;,[object Object],publicclassSteoController : IController,[object Object],{,[object Object],publicvoid Execute(System.Web.Routing.RequestContextrequestContext),[object Object], {,[object Object],HttpResponseBase response = requestContext.HttpContext.Response;,[object Object],response.Write("<h1>Hello MVC World!</h1>");,[object Object], },[object Object],},[object Object],My own Controller,[object Object]

publicinterfaceIHttpHandler,[object Object],{,[object Object],voidProcessRequest(HttpContext context);,[object Object],boolIsReusable { get; },[object Object],},[object Object],publicinterfaceIController,[object Object],{,[object Object],voidExecute(RequestContextrequestContext);,[object Object],},[object Object],They look quite similar, aren’t they?,[object Object],The two methods respond to a request and write back the output to a response,[object Object],The Page class, the default base class for ASPX pages in Asp.Net, implements the IHttpHandler.,[object Object],This reminds me something…,[object Object]

The Action Methods,[object Object],All the public methods of a Controller class become Action methods, which are callable through an HTTP request,[object Object],Actually, only the public methods according to the defined Routes can be called,[object Object]

The ActionResult,[object Object],Actions, as Controller’s methods, have to respond to user input, but they don’t have to manage how to display the output,[object Object],The pattern for the Actions is to do their own work and then return an object that derives from the abstract base class ActionResult,[object Object],ActionResultadhere to the “Command pattern”, in which commands are methods that you want the framework to perform in your behalf,[object Object]

The ActionResult,[object Object],publicabstract class ActionResult,[object Object],{,[object Object],public abstract voidExecuteResult(ControllerContext context);,[object Object],},[object Object],publicActionResultList(),[object Object],{,[object Object],ViewData.Model= // get data from a repository,[object Object],returnView();,[object Object],},[object Object]

ActionResult types,[object Object],EmptyResult,[object Object],ContentResult,[object Object],JsonResult,[object Object],RedirectResult,[object Object],RedirectToRouteResult,[object Object],ViewResult,[object Object],PartialViewResult,[object Object],FileResult,[object Object],FilePathResult,[object Object],FileContentResult,[object Object],FileStreamResult,[object Object],JavaScriptResult,[object Object],Asp.Net MVC has several types to help handle the response,[object Object]

Demo,[object Object],Asp.Net MVC Controllers,[object Object]

The Views are responsible for providing the User Interface (UI) to the user,[object Object],The View receive a reference to a Model and it transforms the data in a format ready to be presented,[object Object],The Views,[object Object]

Asp.Net MVC’s View,[object Object],Handles the ViewDataDictionary and translate it into HTML code,[object Object],It’s an Asp.Net Page, deriving from ViewPage (System.Web.Mvc.ViewPage) which itself derives from Page (System.Web.UI.Page),[object Object],By default it doesn’t include the “runat=server”, that you can add by yourself manually, if you want to use some server controls in your View (better to use only the “view-only” controls),[object Object],Can take advantage of the Master Page, building Views on top of the Asp.Net Page infrastructure,[object Object]

Asp.Net MVC Views’ syntax,[object Object],You will use <%: %> syntax (often referred to as “code nuggets”) to execute code within the View template.,[object Object],There are two main ways you will see this used:,[object Object],Code enclosed within <% %> will be executed,[object Object],Code enclosed within <%: %> will be executed, and the result will be output to the page,[object Object]

Demo,[object Object],Views, Strongly Typed View, specify a View,[object Object]

Html Helpers,[object Object],Html.Encode,[object Object],Html.TextBox,[object Object],Html.ActionLink, RouteLink,[object Object],Html.BeginForm,[object Object],Html.Hidden,[object Object],Html.DropDownList,[object Object],Html.ListBox,[object Object],Html.Password,[object Object],Html.RadioButton,[object Object],Html.Partial, RenderPartial,[object Object],Html.Action, RenderAction,[object Object],Html.TextArea,[object Object],Html.ValidationMessage,[object Object],Html.ValidationSummary,[object Object],Methods shipped with Asp.Net MVC that help to deal with the HTML code.,[object Object],MVC2 introduced also the strongly typed Helpers, that allow to use Model properties using a Lambda expression instead of a simple string,[object Object]

Partial View,[object Object],Asp.Net MVC allow to define partial view templates that can be used to encapsulate view rendering logic once, and then reuse it across an application (help to DRY-up your code),[object Object],The partial View has a .ascx extension and you can use like a HTML control ,[object Object]

The default Asp.Net MVC project just provide you a simple Partial View: the LogOnUserControl.ascx,[object Object],<%@ControlLanguage="C#"Inherits="System.Web.Mvc.ViewUserControl" %>,[object Object],<%,[object Object],if (Request.IsAuthenticated) {,[object Object],%>,[object Object], Welcome <b><%:Page.User.Identity.Name %></b>!,[object Object], [ <%:Html.ActionLink("Log Off", "LogOff", "Account") %> ],[object Object],<%,[object Object], },[object Object],else {,[object Object],%> ,[object Object], [ <%:Html.ActionLink("Log On", "LogOn", "Account") %> ],[object Object],<%,[object Object], },[object Object],%>,[object Object],Partial View Example,[object Object],A simple example out of the box,[object Object]

Ajax,[object Object],You can use the most popular libraries: ,[object Object],Microsoft Asp.Net Ajax,[object Object],jQuery,[object Object],Can help to partial render a complex page (fit well with Partial View),[object Object],Each Ajax routine will use a dedicated Action on a Controller,[object Object],With Asp.Net Ajax you can use the Ajax Helpers that come with Asp.Net MVC:,[object Object],Ajax.BeginForm,[object Object],AjaxOptions,[object Object],IsAjaxRequest,[object Object],…,[object Object],It’s not really Asp.Net MVC but can really help you to boost your MVC application,[object Object]

Routing,[object Object],Routing in Asp.Net MVC are used to: ,[object Object],Match incoming requests and maps them to a Controller action,[object Object],Construct an outgoing URLs that correspond to Contrller action,[object Object],How Asp.Net MVC manages the URL,[object Object]

Routing vs URL Rewriting,[object Object],They are both useful approaches in creating separation between the URL and the code that handles the URL, in a SEO (Search Engine Optimization) way,[object Object],URL rewriting is a page centric view of URLs (eg: /products/redshoes.aspx rewritten as /products/display.aspx?productid=010),[object Object],Routing is a resource-centric (not only a page) view of URLs. You can look at Routing as a bidirectional URL rewriting,[object Object]

publicstaticvoidRegisterRoutes(RouteCollection routes),[object Object],{,[object Object],routes.IgnoreRoute("{resource}.axd/{*pathInfo}");,[object Object],routes.MapRoute(,[object Object],"Default", // Route name,[object Object],"{controller}/{action}/{id}", // URL with parameters,[object Object],new{ controller = "Home", action = "Index", id = UrlParameter.Optional} // Parameter defaults );,[object Object],},[object Object], protectedvoidApplication_Start(),[object Object],{,[object Object],AreaRegistration.RegisterAllAreas();,[object Object],RegisterRoutes(RouteTable.Routes);,[object Object],},[object Object],},[object Object],Defining Routes,[object Object],The default one…,[object Object]

Route URL patterns ,[object Object]

StopRoutingHandler and IgnoreRoute,[object Object],You can use it when you don’t want to route some particular URLs.,[object Object],Useful when you want to integrate an Asp.Net MVC application with some Asp.Net pages.,[object Object]

Filters,[object Object],Filters are declarative attribute based means of providing cross-cutting behavior ,[object Object],Out of the box action filters provided by Asp.Net MVC:,[object Object],Authorize: to secure the Controller or a Controller Action,[object Object],HandleError: the action will handle the exceptions,[object Object],OutputCache: provide output caching to for the action methods,[object Object]

Demo,[object Object],A simple Filter (Session Expire),[object Object]

TDD with Asp.Net MVC,[object Object],Asp.Net MVC was made with TDD in mind, but you can use also without it (if you want… ),[object Object],A framework designed with TDD in mind from the first step,[object Object],You can use your favorite Test Framework,[object Object],With MVC you can test the also your UI behavior (!),[object Object]

Demo,[object Object],TDD with Asp.Net MVC,[object Object]

Let’s start the Open Session:Asp.Net vs. Asp.Net MVC,[object Object]

Asp.Net MVC Intro

Asp.Net MVC Intro

Recomendados

Más contenido relacionado

Was ist angesagt?

Was ist angesagt?(20)

Destacado

Destacado(19)

Similar a Asp.Net MVC Intro

Similar a Asp.Net MVC Intro(20)

Más de Stefano Paluello

Más de Stefano Paluello(6)

Último

Último(20)

Asp.Net MVC Intro