asp.net mvc 3 - eugenio serrano
DESCRIPTION
Presentacion de Eugenio Serrano, en el WebCamp de Cordoba, Argentina, Mayo 2011TRANSCRIPT
![Page 2: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/2.jpg)
¿Que es Razor?¿Qué es MVC 3?Usando Modelos, Vistas y ControladoresHtml Helpers y ValidadoresAJAX en ASP.Net MVC
Agenda
![Page 3: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/3.jpg)
@if (User.Grok(Razor)) {<div>w00t!</div>
}• Nuevo motor de vistas mucho más simple• Permite escribir menos líneas de código• Permite mezclar código fuente y código
de marcado de forma mas natural• Tiene Helpers que nos ahorran el trabajo• Compatible con ASP.NET Web Pages en
WebMatrix
La sistaxis de Razor
![Page 4: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/4.jpg)
Razor comparado con el resto <ul> <% for (int i = 0; i < 10; i++) { %> <li><% =i %></li> <% } %></ul>
<ul> @for (int i = 0; i < 10; i++) { <li>@i</li> }</ul>
Razor (2 transiciones):
Web Forms (6 transiciones):
<ul> <?php for ($i = 0; $i < 10; $i++) { echo("<li>$i</li>"); } ?></ul>
PHP(2 transiciones
y 1 echo):
![Page 5: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/5.jpg)
Generando markup desde el código
@{ var name = “John Doe”; <div> Your name: @name </div>}
@{ var name = “John Doe”; @: Your name: @name}
Opción 3:Una simple linea
de salida
Opción 1:HTML Block
@{ var name = “John Doe”; <text> Your name: @name </text>}
Opción 2:Text Block
![Page 6: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/6.jpg)
Comentarios en Razor@* <div> Hello World </div>*@
@* @{ var name = "John Doe"; @name }*@
Opción 3:Ambos
Opción 1:Markup
@{ //var name = "John Doe”; //@name}
Opción 2:Codigo
![Page 7: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/7.jpg)
No escriba 2 veces lo mismo!Defina 1 layout y uselo en todo el sitio
Layouts para organizar páginas
Layout.cshtml
Page 1
Page 2
Page 3
![Page 8: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/8.jpg)
1. Defina su Layout2. Referéncielos en sus paginas
Sintaxis de los Layouts
<html> <head> <title>Simple Layout</title> </head> <body> @RenderBody() </body></html>
/Shared/_Layout.cshtml
@{ Layout = "/Shared/_Layout.cshtml";}
<p> My content goes here</p>
MyPage.cshtml
![Page 9: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/9.jpg)
Sections permiten definir aéreas de contenido que cambian entre paginas pero necesitan ser incluidas en el Layout
Sections para organizar las páginas
<html> <head> <title>Simple Layout</title> </head> <body> @RenderSection("Menu") @RenderBody() </body></html>
/Shared/_Layout.cshtml
@{ Layout = "/Shared/_Layout.cshtml";}
@section Menu { <ul id="pageMenu">
<li>Option 1</li><li>Option 2</li>
</ul>}<p> My content goes here</p>
MyPage.cshtml
![Page 10: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/10.jpg)
RenderPage() lo ayuda a reusar markup y código que no cambia
Use RenderPage para organizarporciones que no cambian
<html> <head> <title>Simple Layout</title> </head> <body> @RenderSection("Menu") @RenderBody() @RenderPage("/Shared/_Footer.cshtml") </body></html>
/Shared/_Layout.cshtml
<div class="footer"> © 2010 Contoso</div>
/Shared/_Footer.cshtml
![Page 11: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/11.jpg)
MOTOR DE VISTAS RAZORDemostración
![Page 12: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/12.jpg)
ASP.NET MVCUn nuevo framework para desarrollo WebMás control sobre el HTMLMás fácil de hacer testPuede usar Web Forms o RAZOR para generar el HTMLEsta construido sobre en ASP.NET
![Page 13: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/13.jpg)
¿Que ofrece?SoC (Separation of Concerns)
TDD por defaultMantenibilidad
Url y HTML mas limpioSEO y REST friendly
/Clientes/Buscar/Eugenio
CSS Friendly<html> <div> <label> <span>
Modelo de programación mas performanteNo hay ViewStateNo hay modelo de eventos
![Page 14: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/14.jpg)
VIEWSTATE EN WEBFORMS Y MVCDemostración
![Page 15: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/15.jpg)
¿Como funciona?
![Page 16: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/16.jpg)
¿Como funciona?
Request
View
Controller
Response
Controlador:Recupera el modelo.Hace cosas.
Vista:Genera una representaciónvisual del modelo
![Page 17: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/17.jpg)
Rutas
www.sitio.com/products/report/33/11/2009
![Page 18: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/18.jpg)
URLs amigablesLegibles
www.sitio.com/products.aspx?module=reports&productId=33&year=2008&m=11 www.sitio.com/products/report/33/2008/11
Predecibleshttp://es.wikipedia.org/wiki/Microsoft
![Page 19: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/19.jpg)
Ruteo – URIs amigablesSe agregan rutas a la RouteTable globalEl Mapeo crea un objeto RouteData (un diccionario de key/values)
protected void Application_Start(object sender, EventArgs e) { RouteTable.Routes.Add(
"Blog/bydate/[year]/[month]/[day]",new { controller="blog",
action="showposts" },new { year=@"\d{1,4}", month= @"\d{1,2}",
day = @"\d{1,2}"});}
![Page 20: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/20.jpg)
Controlador – Uso BásicoEscenarios, Objetivos y Diseño
Las URLs indican “acciones” del Controlador, no páginas Las acciones deben declarase en el Controlador.El controlador ejecuta lógica y elige la vista.
public ActionResult ShowPost(int id) { Post p = PostRepository.GetPostById(id); if (p != null) { View(p); } else { View("nosuchpost", id); }}
![Page 21: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/21.jpg)
Vistas – Uso BásicoEscenarios, Objetivos y Diseño:
Generan HTML u otro tipo de contenido. Helpers pre-definidos.
Pueden ser WebForms o Razor (u otras)Formatos de salida (images, RSS, JSON, …).Pueden definirse vistas Mock para testing.El controlador ofrece datos a la Vista
Datos Loosely typed o Strongly typed .
![Page 22: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/22.jpg)
ASP.NET MVC 3 Demostración
![Page 23: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/23.jpg)
AJAX en ASP.Net MVCUnobstructive AjaxEvita mezclar código script con código HTMLBasado en jQueryEn MVC 3, se han portado todas las librerías de script a jQueryValidadores remotos
![Page 24: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/24.jpg)
ASP.NET MVC 3 Y AJAXDemostración
![Page 25: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/25.jpg)
Mantengo menos de3 Web Apps. Necesito una herramienta que sea fácil de usar, de configurar, y poder publicar mis sitios
fácilmente
Quiero crear sitios por mi cuenta para
aprender a usar una herramienta y
conocer un framework de
forma fácil
Soy un desarrollador profesional y construyo grandes (y complejos) sitios web junto a un
grupo desarrolladores
ASP.NET: Un Framework para todo
![Page 26: ASP.Net MVC 3 - Eugenio Serrano](https://reader034.vdocument.in/reader034/viewer/2022051610/5484c640b47959f10c8b4ccd/html5/thumbnails/26.jpg)
ASP.NET: Un Framework para todo
Caching Modules
HandlersIntrinsics
Pages Controls
Globalization
Profile
Master Pages
MembershipRoles
Etc.
ASP.NET Core
ASP.NET Web Forms
ASP.NET MVC
ASP.NET Web Pages
Web Forms View Engine Razor View Engine
Visual Studio 2010 WebMatrix