asp .net mvc 4 paso a paso en 6 días

8/18/2019 ASP .NET MVC 4 Paso a Paso en 6 días

1/134

Aprender ASP .NET Paso a Paso en 7 días | 1

TUT: Aprender ASP .NET MVC Paso aPaso en 7 dias (Dia 1)

Este artículo es parte de Aprender paso a paso ASP.NET MVC en 7 días y puedes revisarlo en loslink siguientes:

• ia !: Controladores" vistas #uerte$ente tipadas y clases %elper

• ia &: Testeo unitario" ruteo de '() saliente

• ia *: Vistas parciales" anotaciones de datos" (a+or" Autenticacion y Autori+acion

• ia ,: -SN" -/uery" ad$inistrador de sesiones y controladores asíncronos

• ia 0: E$pa1ueta$iento" Mini#icacion " Vie2Model " Mane3o de e4cepciones y Areas

• ias 5: Mdos de Visuali+aci6n" Proveedor MVC Aut%" Enlace Modelo MVC

Contenido

• ¿Por qué e !ode"#e$ind en %an #ueno en ASP.NET&

• Pro#e'a n'ero 1: Tes%eo Uni%ario

• Pro#e'a n'ero : *a reaidad de a separa!i+n de !+di,o - a U

• Nues%ro /éroe MVC (Modeo0 Vis%a - Con%roador)

• Pre"equisi%os

• *a# 21: Creando una si'pe Api!a!ion ASP.NE% MVC 3/oa Mundo4

1

http://maninformatic.blogspot.com.ar/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com.ar/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/tut-aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/06/aprender-asp-net-mvc-paso-paso-en-7_7.htmlhttp://maninformatic.blogspot.com/2014/08/tut-aprender-asp-net-mvc-paso-paso-en-7.html?showComment=1434381214351#c6150926683497608148http://maninformatic.blogspot.com/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/tut-aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/06/aprender-asp-net-mvc-paso-paso-en-7_7.htmlhttp://maninformatic.blogspot.com/2014/08/tut-aprender-asp-net-mvc-paso-paso-en-7.html?showComment=1434381214351#c6150926683497608148http://maninformatic.blogspot.com.ar/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com.ar/2013/10/aprender-mvcmodelo-vista-controlador.html


2/134


• *a# 2: Pasando da%os en%re e !on%roador - a 5is%a

• *a# 26: Creando un si'pe 'odeo usando MVC

• *a# 2: Creando un si'pe 8or'uario de en%rada de da%os MVC

• *a# 29: Usando aor para !rear 5is%as r;pida'en%e

Co'o e no'#re de ar%

*a 'anera !o'o aprenderé'os MVC en es%a serie de ar%

Queriendo demostrar que el concepto MVC es igual entre ASP.NET MVC y SPRING MVC es

que realizare Aprender MVC con las dos tecnologías ( para ls amantes de microsoft y para los

amantes del software libre).

Pueden revisar Aprender SPRING MVC Paso a Paso en 7 dias (Dia 1)

¿Porque el code-behind en tan bueno en ASP.NET?

Es%o- se,uro que %odos os desarroadores es ,us%a e !on!ep%o de !ode"#e$ind. *aa!ep%a!i+n de a,o nue5o !o'o MVC0 no es nada 8;!i para eos.

Cuando $a#a'os de !ons%ruir api!a!iones ASP.NET en una arqui%e!%ura de !apas0eas se di5iden en !ua%ro par%es: U (pa,inas ASP=)0 !ode"#e$ind (ar!$i5os ASP=.!s)0!apa in%er'edia (!ases .NET) - 8ina'en%e a !apa de Da%os (Da%a a-er).

Si se 'ira os aspe!%o de a dis%ri#u!i+n de !+di,o0 e 'a-or !+di,o e !ua %iene a+,i!a es a !apa in%er'edia o e !ode"#e$ind (ar!$i5os ASP=.!s). *a U (n%er8a deUsuario) o ar!$i5os ASP= son ar!$i5os /TM*0 os !uaes son ';s a!er!a dedise>ador de a in%er8a de usuario0 - a +,i!a de a!!eso a da%os son ';s o 'enos!o'ponen%es es%;ndar !o'o os En%erprise Da%a ?o!@s.

2

http://maninformatic.blogspot.com/2013/12/aprender-spring-mvc-sobre-gae-paso-paso_8074.htmlhttp://maninformatic.blogspot.com/2013/12/aprender-spring-mvc-sobre-gae-paso-paso_8074.html


3/134


Va'os a anaiar os pro#e'as.

Problema número 1: Testeo nitario

De os aspe!%os de %es%eo uni%ario pode'os e!uir a *+,i!a de da%a - e U /TM*.*as !ases de +,i!a de da%os son -a !o'ponen%es %es%eados !o'o En%erprise Da%a?o!@0 en%i%- da%a !on%e%0 o *NB da%a !on%e%. Noso%ros -a no %ene'os que in!uires8ueros en %es%ear separada'en%e e DA*. En !aso que % %en,as un !apa dea!!eso a da%os personaiado es%e ser


4/134


Co'o die pre5ia'en%e0 os ASP= - os ASP=.!s0 no pueden ser desa!opados0 o queredu!e a reu%iia!i+n. Si0 Mi!roso8% dio pri'ero que e !ode"#e$ind es di8eren%e de aU0 pero en%on!es eos son soo ar!$i5os 8


5/134


Co'o es%e Con%roador es un si'pe !ase .NET0 pode'os reusaro - $a!er %es%eosuni%arios 8;!i'en%e. Va'os a 5er !+'o pode'os !rear Api!a!i+n MVC usando aPan%ia MVC pro5is%a por Visua S%udio.

Pre-/equisitos

" Visua S%udio 21 (Cuaquier 5ersi+n). Es%o in!u-e ASP.NE% MVC

"ab 01: Creando una sim#le A#licaci$n ASP.NEt *+C (ola *undo2

En es%e a#ora%orio !reare'os un si'pe pro,ra'a $oa 'undo0 u%iiando a pan%iaMVC. Creare'os un si'pe !on%roador0 !one!%a e !on%roador a una si'pe p;,inainde.asp - 5er a p;,ina en un ?roFser.

5


6/134


Paso 01: Crear el Pro&ecto

Crear un nue5o pro-e!%o see!!ionando Api!a!i+n He# de ASP.NET MVC - !o'ono'#re de pro-e!%o M-Iis%/eoHord0 en a si,uien%e 5en%ana see!!iona'os 5a!io.

Una 5e $e!$o !i!@ en A!ep%ar0 -a %iene $e!$o a es%ru!%ura !on as !arpe%asapropiadas0 donde puedes a,re,ar !on%roadores0 5is%as - 'odeos.

6


7/134


Paso 0!: A%re%ar un controlador

A$ora 5a'os a a,re,ar un nue5o !on%roador !o'o se 'ues%ra en a si,uien%e 8i,ura.

Paso 03: A%re%ar una 4ista

A$ora que %ene'os e !on%roador0 ne!esi%a'os a,re,ar a 5is%a. /a!e'os !i!@dere!$o en a 8un!i+n nde e !ua es%; en e !on%roador - see!!iona'os Add VieF.

7


8/134


En e !uadro de diao,o se indi!a e no'#re de a 5is%a0 e !ua de#e ser e 'is'o queen e !on%roador (nde)J desa!%i5a 3Usar una p;,ina de dise>o o 'aes%ra40 porque noquere'os que nues%ra 5is%a $erede de un Mas%erPa,e.

Una 5e $e!$o en a!ep%ar0 podre'os 5er una si'pe pa,ina ASP= !on e si,uien%e!+di,o /TM*.

8


9/134


Paso 05: E6ecutar la A#licaci$n

Si $a!es C%r K I9 5er;s un error. Es%e error es o#5io0 porque no in5o!a'os apropiada'en%e e !on%roadorLa!!i+n.

Si di,i%as en e #roFser a U* de#es ser !apa de 5er !orre!%a'en%e a 5is%a.

"ab 0!: Pasando datos entre el controlador & la 4ista

E !on%roador re!i#e a pri'era !ar,a de 'odeo0 a 'a-or


10/134


A$< es donde a nue5a %é!ni!a de ,es%i+n de sesiones se $a in%rodu!ido en e 'ar!ode ASP.NET MVC0 es de!ir e VieFDa%a.

10


11/134


Paso 01: Crear #ro&ecto & de7inir la 4ista de datos.

E pri'er paso es !rear un pro-e!%o - un !on%roador. En e !on%roador0 de8inir a5aria#e 5ieFda%a0 !o'o 'os%ra'os en e !+di,o de a#ao.

Paso 0!: *ostrando el 4ie8 data en la 4ista.

*o si,uien%e es 'os%rar da%a en a 5is%a pero usando e %a, por!en%ae. Uno de ospun%os ';s i'por%an%es a no%as es que a 5is%a no %iene !od"#e$ind. Para 'os%rar a5is%a ne!esi%a'os usar e %a, en a p;,ina ASP=.

11


12/134


Paso 03: E6ecutamos la a#licaci$n

Presiona'os C%rKI9 - 'odi8i!a'os a U* en e ?roFser.

"ab 03: Creando un sim#le modelo usando *+C

En es%e a#ora%orio !reare'os un si'pe 'odeo personaiado0 es%o !on a,unosda%os - 'os%raro en a 5is%a.

Paso 01: Creamos un sim#le archi4o de clase

e pri'er paso es !rear un si'pe 'odeo personaiado e !ua es%; en #an!o !on%res propiedades: !ode0 na'e0 - a'oun%. Crear un si'pe Pro-e!%o MVC - $a!er !i!@en a !arpe%a 'ode - !i! en Add NeF %e' - see!!ionar !ase - asi,nare e no'#reCurs%o'er.

12


13/134


Paso 0!: 9e7inimos un controlador con acci$n

e pri'er paso es !rear un !on%roador - a,re,ar una si'pe a!!i+n que 'ues%re eCus%o'er.

'por%ar e na'espa!es de 'odeo en a !ase !on%roador0 !rea'os un o#e%o de a!ase Cus%o'er !on a,unos da%os - o pasa'os a a 5is%a a'ado 3Dispa-Cus%o'er4.

Paso 03: Creamos una 4ista 7uertemente ti#ada usando la clase.

13


14/134


Ne!esi%a'os a$ora unir os pun%os de MVC0 'edian%e a !rea!i+n de 5is%as. /a!e !i!dere!$o en e 'é%odo Dispa-Cus%o'er den%ro de !on%roador (Con reaiado en epri'er a#ora%orio).

Nota: Pre5ia'en%e es ne!esario que se !o'pie e pro-e!%o

a 5en%aa de !rear una 5is%a 8uer%e'en%e %ipada es que se pueden o#%ener aspropiedades de as !ases en a 5is%a pero di,i%ando 'ode - 3.4 !o'o se 'ues%ra:

A#ao es%a e !+di,o de a 5is%a (sin%ais aor) e !ua 'ues%ra os 5aores de aspropiedades de !ien%e. Ta'#ién pode'os asi,nar una !ondi!i+n I que 'ues%re os!ien%es !o'o un !ien%e pri5ie,iado si a !an%idad es%; por arri#a de 122 - un !ien%enor'a si es%; por de#ao de 122.

14


15/134


Paso 05: E6ecuta la a#licaci$n

A$ora para ee!u%ar a api!a!i+n presiona C%rKI9.

"ab 05: Creando un sim#le 7ormulario de entrada de datos *+C

Cada pro-e!%o peque>o o ,rande ne!esi%a un 8or'uario de en%rada de da%os. En es%ea#ora%orio !reare'os una si'pe en%rada de da%os para nues%ro !ien%e !o'o se'ues%ra:

15


16/134


Tan pron%o !o'o e usuario 8ina in,rese os de%aes - en5


17/134


Después0 si,uiendo os pasos an%eriores de !+'o !rear una 5is%a (Ci!@ dere!$o - AddVieF) !rea'os a 5is%a IiCus%o'er.

Paso 0!: Creando el controlador

Arri#a de8ini'os a a!!i+n de 8or'uario $a!ia e !on%roador a a 8un!i+nDispa-Cus%o'er

Ne!esi%a'os o#%ener os da%os de os !on%roes /TM* (8or')0 ena e o#e%o - en5iar

e o#e%o a a 5is%a.

De#ao e !+di,o de Dispa-Cus%o'er0 ena e o#e%o !us%o'er !on os da%os de a!oe!!i+n eques%.Ior' - en5


18/134


Paso 03: Creando la 4ista #ara mostrar el ob6eto customer

E si,uien%e paso es !rear a 5is%a Dispa-Cus%o'er0 see!!ionado a op!i+n 5is%a8uer%e'en%e %ipada ( reaiada en os pasos an%eriores).

Paso 05: ;inalmente e6ecutar el #ro&ecto

Presionando as %e!as CT* K I9 ee!u%a'os e pro-e!%o.

18


19/134


O a $a!er !i! en e #o%+n en5iar0 'ues%ra a 5is%a Dispa-Cus%o'er.

"ab 0


20/134


En orden para !rear una e%ique%a 8or'a para /TM* ne!esi%a'os usar3/%'.?e,inIor'4

E !+di,o de arri#a ,enera e si,uien%e !+di,o /TM*:

E raor /TM* 3?e,inIor'4 %o'a %res par;'e%ros no'#re de a a!!i+n0 e no'#re de

!on%roador - e 'é%odo /TTP (ET0 PST).

Va'os a !rear e 8or'uario de en%radas de da%os:

Paso 03: Creando una 4ista ;uertemente ti#ada

Para !rear e 8or'uario !on aor es ne!esario que a 5is%a se $a-a !reado !on aop!i+n 5is%a 8uer%e'en%e %ipada !o'o se reaio en e a#ora%orio 26. Pero si no se$io es%o en a par%e superior de a 5is%a a,re,a'os o si,uien%e - $a!er a 5is%a8uer%e'en%e %ipada.

Con es%o -a pode'os !rear nues%ro 8or'uario en a 5is%a IiCus%o'er.

20


21/134


Paso 05: Creando el controlador

*a par%e 8ina es e !+di,o de !on%roador (Cus%o'er)0 e !+di,o de !on%roador a$oraes ';s si'pe0 e o#e%o !us%o'er 5a ser au%o enado por nues%ras !ase raor.

- a 8ina ee!u%ar - 'os%rar; os da%os

21


22/134


TUT: Aprender ASP .NET MVC Paso aPaso en 7 dias (Dia )

Contenido

• Cu8l es la Agenda9

• )a ;5: Testeo 'nitario en Proyectos MVC

• )a ;7: Entendiendo el (uteo en MVC

• )a ; %ay para el Tercer ía9

¿Cuál es la Agenda?

Este artículo es la continuaci6n de Aprender paso a paso en 7 dias y puedes revisarlo en los link

siguientes:





22

http://maninformatic.blogspot.com.ar/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com.ar/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/tut-aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com.ar/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com.ar/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/tut-aprender-asp-net-mvc-paso-paso-en-7.html


23/134



• ias 5: Modos de Visuali+aci6n" Proveedor MVC Aut%" Enlace Modelo MVC

23

http://maninformatic.blogspot.com/2014/06/aprender-asp-net-mvc-paso-paso-en-7_7.htmlhttp://maninformatic.blogspot.com/2014/08/tut-aprender-asp-net-mvc-paso-paso-en-7.html?showComment=1434381214351#c6150926683497608148http://maninformatic.blogspot.com/2014/06/aprender-asp-net-mvc-paso-paso-en-7_7.htmlhttp://maninformatic.blogspot.com/2014/08/tut-aprender-asp-net-mvc-paso-paso-en-7.html?showComment=1434381214351#c6150926683497608148


24/134


En este dia & vere$os los siguientes cuatro laoratorios:

• Escriiendo Testeos 'nitarios en Proyectos MVC.

• Con#igurar (utas en MVC

• Validaci6n de (utas en MVC

• Con#igurando (utas de salida en MVC

Lab 06: Testeo Unitario en Proyectos MVC

Cuando e$pe+a$os toda la serie MVC ?ia !@ e$pe+a$os con dos prole$as relacionados al

codee%ind.

¿Cóo !odeos "acer testeos unitarios en A#P$%&T code be"ind?

¿Cóo !odeos reusar el code be"ind de A#P$%&T con di'erentes inter'aces de usuarios?

En esta secci6n va$os a concentrarnos en el pri$er punto" es decir" Testeo 'nitario.

Solo una r8pida recapitulaci6n si necesita$os %acer testeo unitario al siguiente

$>todo btngeneratein(oices)clic* de Code e%ind de ASP.NET" tene$os los siguientes

prole$as:

• C6$o %ace$os para crear los o3etos sender y e(entargs9

• El c6digo de aa3o se e3ecuta a3o el o3eto BttpConte4t" C6$o puedo i$itarlo9

• /u> pasa con los controles de inter#a+ de usuario de ASP.NET" C6$o accedo a estos9

• /u> pasa con otros o3etos de ASP.NET co$o los o3etos sesi6n y aplicaci6n" c6$o

accedo a estos9

Muc%os desarrolladores podrían %alar acerca de $ock tests" r%ino $ocks" etc. pero todavía esto

es desaperciido y la co$pilaci6n au$enta con las variales de sesi6n" o3etos de data vie2"

controles ASP.NET '" creando aun $8s con#usi6n.

24


25/134


Así 1ue lo 1ue %are$os en esta secci6n es crear una si$ple aplicaci6n MVC y %are$os teste

unitario en aplicaciones ASp.NEt usando el testeo unitario de Dra$e2ork VSTS.

Paso +: Crear un si!le !royecto las ostrar Custoer$

El pri$er paso es crear un si$ple proyecto MVC. 'sare$os el $is$o proyecto el cual nosotros

tene$os creado en MVC ?Modelo Vista Controlador@ del día ! ?MyDirstBelloorld@. En caso no

tengas el proyecto $encionado" por #avor crea uno usando el enlace de arria.

)a clase controlador al #inal del día ! es una si$ple clase .NET. Por e3e$plo" si $iras el c6digo

del proyecto cercana$ente" puedes ver #8cil$ente la clase controlador de Custo$er con se

$uestra a continuaci6n:

25

http://maninformatic.blogspot.com/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com/2013/10/aprender-mvcmodelo-vista-controlador.html


26/134


En si$ples palaras este es una si$ple clase .NET pode$os #8cil$ente instanciar la clase y crear

auto$8tica$ente testeos unitarios para el $is$o. Esto es e4acta$ente lo 1ue va$os %acer en

nuestros siguientes pasos:

Paso ,: Agregando un si!le !royecto de testeo unitario$

Va$os a usar nuestro testeo unitario del #ra$e2ork de VSTS para testear la clase controlador.

Agrega un nuevo proyecto a su soluci6n usando la plantilla Proyecto Pruea 'nitaria.

26


27/134


Paso -: Agregar re'erencias a!ro!iadas al !royecto

Necesita$os agregar una re#erencia a la aplicaci6n MVC en nuestro proyecto de pruea unitaria

?MVC'nitTest@" para 1ue poda$os controlar la clase Controlador.

'na ve+ agregado la re#erencia" deerías ver en la aplicaci6n MVC e la re#erencia de proyecto

co$o se $uestra en la siguiente i$agen:

Paso .: &scribir la !rueba unitario

'na ve+ 1ue tengas agregado la re#erencia" are la clase de pruea unitaria" es

decir UnitTest+$cs$ En esta clase crear un si$ple $>todo de teste lla$ado /is!layCustoer el

cual es atriuido por el atriuto TestMet"od co$o se $uestra en el siguiente c6digo.

Si tu ves el siguiente peda+o de c6digo esta$os creando un o3eto de la clase controlador"

invocando la acci6n del controlador" es decir" isplayCusto$er y entonces veri#ica$os si el

no$re de la vista es isplayCusto$er. Si ellos son igual esto signi#ica el paso de la pruea o en

caso contrario esto es #allido.

27


28/134


28


29/134


30/134


Lab 3: &ntendiendo el ruteo MVC

4ntroducción

Al #inal del día" MVC no es nada $8s 1ue una direcci6n de '() asignada a los controladores y los

controladores asignados a acciones.

Por e3e$plo cuando un usuario envía un re1ueri$iento de '() co$o

%ttp:HH222.$anin#or$atic.co$H'icaProducto del navegador" estas acciones son asignadas con

los controladores de MVC" y los controladores de MVC #inal$ente invocan esas #unciones.

)o siguiente es una si$ple tala el cual $uestra c6$o todo esto se ve así.

30


31/134


AIadiendo aFn $8s a la co$plicaci6n 1ue pode$os tener varias direcciones '() asignadas a un

controlador o se puede tener $8s de un controlador asigna a una sola '(). Por e3e$plo" puedes

tener555$anin'oratic$cocontactenos y 555$anin'oratic$coconocenos asignada a

un solo controlador lla$ado ConocenosController

.

Sería $uy ueno si tene$os algFn tipo de $ecanis$o por el cual pode$os con#igurar estas

asignaciones. Eso es lo 1ue e4acta$ente MVC routing signi#ica. El enruta$iento MVC ayuda a

con#igurar y asignar la direcci6n '() con los controladores #8cil$ente.

Paso +: Toar el !royecto MVC creado en el dia +

Va$os a to$as el $is$o proyecto de Custo$er ? MyDisrtBelloorld@ 1ue %e$os desarrollado en la

secci6n anterior.

Paso ,: Cabiar 7lobal$asa8$cs

Todas las asignaciones de rutas son al$acenados en el arc%ivo de c6digo #uente (outeCon#ig.cs.

Así 1ue co$o pri$er paso es 1ue tene$os 1ue ir a ca$iar este arc%ivo.

31


32/134


Todas las asignaciones de rutas son al$acenadas dentro de la colecci6n lla$ada routes. Esta

colecci6n pertenece al na$espaces Syste$.e.(outing. Para agregar una ruta tu necesitas

lla$ar el $>todo Map(oute y pasar tres par8$etros na$e" url y de#aults.

ea3o est8 una captura de reta+o de c6digo de la #unci6n Map(oute.

• %ae es el no$re principal por la cual la ruta ser8 identi#icada dentro la colecci6n.

• U9L de#ine 1ue tipo de #or$ato de '() 1uere$os conectar con el controlador. En el

peda+o de c6digo siguiente deci$os 1ue el #or$ato '() es Vie5Vie5Custoer$

• /e'aults de#ine la clase controlador y las #unciones de accion los cuales ser8n invocados

cuando la '(l es lla$ada. Por e3e$plo" en el c6digo siguiente" deci$os 1ue cuando

Vie2HVie2Custo$er es lla$ado" este invocar8 la clase controlador Custo$er y la #unci6n

acci6n invocada sera /is!layCustoer$

En caso su controlador to$e par8$etros" puede usar el J [email protected] e3e$plo en el siguiente

peda+o de c6digo" nosotros %e$os usado J para especi#icar 1ue pode$os tener un par8$etro id.

Si 1uieres de#inir los par8$etros co$o opcionales puedes usar el enu$ UrlParaeter$!tional$

32


33/134


)o pri$ero es co$entar el c6digo de asignaci6n predeter$inada. Va$os a e4plicar el c6digo de

asignaci6n predeter$inada $8s tarde.

ngresa$os el siguiente c6digo" el cual signi#ica cuando lla$a$os a

%ttp:Hlocal%ostHvie2HVie2Custo$er esto invocar8 al controlador Custo$er y lla$ara la #unci6n

isplayCusto$er.

Paso -: &2ecuta la a!licación

Si e3ecutas la aplicaci6n deerías ver lo siguiente:

%ota: No $uestra ningFn no$re" por1ue esto tiene 1ue ser enviado del #or$ulario" y puedes

proar ca$iando el la propiedad action del #or$ulario vie2Hvie2Custo$er@.

33


34/134


Si recuerdas nosotros co$enta$os la entrada de ruta por de#ecto ?de#ault@" va$os a entender

1u> signi#ica e4acta$ente ese c6digo.

KJcontrollerLHJactionLHJidL de#ine este 1ue la '() ser8 auto$8tica$ente lla$ado con la

convenci6n Controlador ?no$reH#unci6n@ acci6n ?no$reHvalor@. Si tienes una clase controlador

con Custo$er y #unci6n acci6n co$o Searc% entonces la '() ser8 estructurada auto$8tica$ente

co$o %tt:HH222.$anin#or$atic.co$HCusto$erHSearc%.

Lab ;: Validando y asignando (alores !or de'ecto a U9Ls de MVC

MVC tiene 1ue ver con la acci6n 1ue se produce a trav>s de la '() y los datos para esas acciones

ta$i>n es proporcionado por la '().

Sería ueno si pudi>ra$os validar los datos 1ue se trans$iten a trav>s de estas '() de MVC.

Por e3e$plo va$os a considerar la '() MVC %ttp:HHlocal%ostHCusto$erHVie2Custo$er si 1uieres

ver el detalle para el c6digo del custo$er !;;!" necesitas ingresar

%ttp:HHlocal%ostHCusto$erHVie2Custo$erH!;;!.

El c6digo de Custo$er es un nF$ero natural. En otras palaras" cual1uier persona 1ue ingrese

una '() MVC co$o %ttp:HHlocal%ostHCusto$erHVie2Custo$erHS%iv es inv8lida. El #ra$e2ork MVC

provee un $ecanis$o de validaci6n por el cual pode$os co$proar en la propia '() si el dato es

apropiado. En este laoratorio vere$os c6$o validar datos el cual es ingresado en la '() MVC.

Paso +: Creando un si!le odelo Custoer$

En este pri$er paso va$os a traa3ar con nuestra si$ple clase $odelo Custo$er ya creada en los

pasos anteriores.

34


35/134


Paso ,: Creando la clase controlador

En el siguiente paso va$os a utili+ar la clase controlador Custo$er ya creada en pasos anteriores

agregando una colecci6n de Custo$ers en el constructor.

El controlador tiene una si$ple #unci6n isplayCusto$er el cual $uestra los clientes usando el

valor . Esta #unci6n to$a el valor d y encuentra en la colecci6n custo$er.

35


36/134


Si $iras en la #unci6n isplayCusto$er esta to$a un valor id el cual es nu$>rico. eería$os

to$ar co$o una validaci6n el ca$po el cual indica lo siguiente:

• d deería sie$pre ser nu$>rico

• Este deería ser entre ; y ==

36


37/134


Paso -: A!licando Validación usando rege8 en la ruta MVC

)a validaci6n descrito en el paso & puede ser logrado aplicando e4presiones regulares en el

$apeo de ruta ?Map(oute@. Si va$os al arc%ivo (outeCon#ig.cs y ve$os la #unci6n $aproute." la

entrada a esta #unci6n es el constraint co$o se $uestra es la #igura de aa3o.

En este orden para aco$odar la validaci6n necesita$os especi#icar el rege4 constraint es decir

OdJ!"&L en la #unci6n $aproute co$o se $uestra aa3o. OdJ!"&L en rege4 signi#ica 1ue la

entrada deería ser nu$>rico y ser un $84i$o de ! o & es decir entre ; y ==.

Puedes especi#icar los valores por de#ecto diciendo idQ; co$o se $uestra en el c6digo de aa3o.

En el caso de 1ue no est> especi#icado este to$ara el valor ; por de#ecto.

37


38/134


Paso .: Probando si esto traba2a

A%ora 1ue esta$os %aciendo la validaci6n usando la #unci6n a!route" es tie$po de proar si

esta validaci6n traa3a. )a pri$era pruea tene$os 1ue especi#icar ! y vere$os 1ue el

controlador es correcto y la data es $ostrada.

Si especi#ica$os un valor $ayor a ==" deería$os otener un error co$o se $uestra aa3o. Por

#avor note 1ue el error es con#uso pero es el e#ecto de la validaci6n rege4 el cual especi#ica la

#unci6n $aproute.

38


39/134


El punto $8s i$portante a notar es 1ue esta validaci6n se e3ecuta antes 1ue la solicitud a la

#unci6n del controlador.

Lab


40/134


)o ideal es 1ue las acciones deerían direccionar a las p8ginas. )os enlaces deerían tener

acciones en la eti1ueta anc%or ?RaG@ y no no$res de p8ginas es decir no$res de vistas.

Paso +: Creando el controlador !ara las (istas

e#ini$os las acciones 1ue invocaran estas vistas. En el siguiente codigo tene$os de#inido tres

acciones: otoBo$e ? esta invoca a la vista Bo$e@" Aout's ?Este invoca a la vista

aout@" y SeeProduct ?Este invoca a la vista product@.

Paso ,: Creando (istas

A%ora va$os a crear las vistas para los tres $>todos de#inidos en el controlador Site ?Aout"

Bo$e" Product@.

40


41/134


A%ora va$os a crear una si$ple navegaci6n entre estas si$ples p8ginas co$o se $uestra aa3o.

e la vista Bo$e nosotros estaría$os navegando a las vistas Aout y Product. e las vistas Aout

y Product estaría$os navegando atrasa la vista Bo$e.

Paso -: !ro(eyendo acciones en los lin*$

Para invocar las acciones relacionadas a las vistas necesita$os especi#icar las acciones en la

eti1ueta anc%or co$o se $uestra en el siguiente c6digo.

41


42/134


El c6digo de arria #ue para la vista Product" pues %acer lo $is$o para las vistas Aout y Bo$e.

Para la Vista Bo$e:

Para la vista Aout:

Paso .: /is'rutando su na(egación

Antes de proar la navegaci6n" es necesario $odi#icar el $apeo de ruta $odi#icado el los

laoratorios anteriores. Asi va$os al arc%ivo (outeCon#ig.cs. y lo de3a$os con en un inicio:

42


43/134


A%ora si tienes especi#icado las acciones dentro el enlace" navegas entre las paginas Bo$e" aout

y product.

Mientras navegas puedes ver co$o el '() son dirigidos a las acciones $as 1ue a los no$res de

las paginas co$o %o$e.asp4" aoutus.asp4 el cual viola co$pleta$ente los principios MVC.

43


44/134


TUT: Aprender ASP .NET MVC Paso aPaso en 7 dias(D %ay para el Cuarto ía9

¿Cuál es la Agenda?

Este artículo es la continuaci6n de Aprender paso a paso en 7 días y puedes revisarlo en los linksiguientes:



44

http://maninformatic.blogspot.com.ar/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com.ar/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com/2013/12/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com.ar/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com.ar/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2013/10/aprender-mvcmodelo-vista-controlador.htmlhttp://maninformatic.blogspot.com/2013/12/aprender-asp-net-mvc-paso-paso-en-7.html


45/134






En este día * vere$os los siguientes cinco laoratorios:

• Vistas paciales

• Validaci6n usando anotaciones de data

• (a+or ?MVC ,@

• MVC indo2s Aut%entication

• MVC Dor$s Aut%entication

Lab +0: Vistas Parciales

Cuando %ala$os acerca de aplicaciones 2e" reusailidad es la clave. Co$o desarrolladores

MVC estaría$os gustosos para crear vistas reusales. Nosotros gustaría$os crear vistas reusales

co$o Vistas de caecera y pie de p8gina y usarlos dentro de una vista MVC grande.

)a vistas reusales podrían se logrados creando KVistas Parciales.

45

http://maninformatic.blogspot.com/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/tut-aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/06/aprender-asp-net-mvc-paso-paso-en-7_7.htmlhttp://maninformatic.blogspot.com/2014/08/tut-aprender-asp-net-mvc-paso-paso-en-7.html?showComment=1434381214351#c6150926683497608148http://maninformatic.blogspot.com/2014/01/aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/01/tut-aprender-asp-net-mvc-paso-paso-en-7.htmlhttp://maninformatic.blogspot.com/2014/06/aprender-asp-net-mvc-paso-paso-en-7_7.htmlhttp://maninformatic.blogspot.com/2014/08/tut-aprender-asp-net-mvc-paso-paso-en-7.html?showComment=1434381214351#c6150926683497608148


46/134


Paso +: crear una si!le (ista

Para desarrollar este laoratorio va$os a crear un nuevo proyecto vacío MVC ?MvcTerceria@.

El pri$er paso ser8 crear una si$ple vista con un controlador. Puedes ver en la siguiente captura"

A%í %ay una si$ple vista lla$ada Knde4.asp4 el cual ser8 invocada via Bo$eControlles.asp4.

Paso ,: Crear una si!le (ista !arcial

A%ora 1ue %e$os creado la vista principal" es tie$po de crear una vista parcial el cual puede ser

consu$ido desde la vista Knde4. En orden para crear la vista parcial" click derec%o sore la

46


47/134


carpeta vie2 y agregar vista" $arcar el c%eck o4 KCrear co$o vista parcial co$o se $uestra en

la siguiente #igura.

Paso -: Llaar a la (ista !arcial en la !rinci!al$

ngresar algo de te4to o l6gica en la vista parcial

Paso .: Llaar a la (ista !arcial en la !rinci!al$

Dinal$ente lla$ar la vista parcial en la vista principal usando la #unci6n KBt$l.(ederPartial y

pasar el no$re de la vista en la #unci6n co$o se $uestra en el siguiente c6digo.

47


48/134


Ta$ien asegurarse 1ue la vista parcial este en el $is$o #older donde est8 su vista principal. Es

caso de 1ue no este " entonces necesitaras pasar el pat% en la #unci6n (enderPartial. Puedes ver

la siguiente #igura se %a $ovido la vista parcial en el #older Vie2sHBo$e.

Paso : &2ecutar el !rograa ara (er la acción

Dinal$ente presionar CtrlD0" y veras co$o se carga la vista parcial.

Lab ++: Validación usando Anotación de /ata

)a validaci6n de data es una de las principales cosas en cual1uier aplicaci6n 2e. Co$o

desarrollador deerías e3ecutar la validaci6n en el cliente ?ro2ser@ y en el servidor. Así 1ue

proale$ente le gustaría escriir la validaci6n de una ve+ y luego esperar el #ra$e2ork de

validaci6n para generar la l6gica de validaci6n en a$os e4tre$os.

Uuenas noticias" esto es posile pero usando anotaciones de data. En MVC validas los valores del

$odelo. Cada ve+ 1ue la data llega desde el $odelo tu preguntaras al $odelo diciendo" es este la

propiedad proveída9" son los valores dentro del rango9.

48


49/134


)as Anotaciones de data son $etadata el cual puedes aplicar en el $odelo en el #ra$e2ork MVC

validara usando la $etadata proveída.

En este laoratorio va$os a en#ocar la validaci6n usando anotaciones de datos. )o pri$ero 1ue

va$os a %acer es" en el $is$o proyecto ?MVCTerceria@" crear una clase $odelo Custo$er y una

vista #uerte$ente tipada de entrada de datos lla$ada Bo$e.cs%t$l.

Asu$iendo 1ue tienes creado el $odelo y la vista #uerte$ente tipada" va$os a e$pe+ar a aplicar

Anotaciones de ata.

Paso +: /ecorar el odelo con Anotación de /ata$

$portante i$portar el espacio de no$res ataAnnotations co$o se $uestra en el c6digo de

aa3o.

Va$os a decir 1ue tene$os un $odelo Custo$er y 1uere$os asegurar 1ue el ca$po c6digo es

oligatorio.

Entonces aplicar el atriuto K(e1uired co$o se $uestra en el siguiente c6digo. si la validaci6n

#alla y le gustaría $ostrar un $ensa3e de error" puedes pasar el KErrorMessage ta$i>n.

Paso ,: Cabiar el codigo =oe$cs"tl

A%ora %ay algunos ca$ios de c6digo 1ue deeria$os %acer en el c6digo Bo$e.cs%t$l. entro

49


50/134


del ody nos gustaría $ostrar el $ensa3e de error si la data no es correcto es es %ec%o usando el

siguiente c6digo.

Ta$i>n necesita$os codi#icar nuestro #or$ulario de ingreso de datos. a continuaci6n se $uestra

el #rag$ento de c6digo para el $is$o. Note 1ue la #uncion KEditorDorModel auto$8tica$ente

generara los controles ' de acuerdo a las propiedades del $odelo. Entonces no necesita$os

crear el control de #or$a individual co$o se %i+o en los laoratorios anteriores.

Paso -: A"ora en la clase controlador Custoer$

A%ora en la clase controlador Custo$er agrega$os la validaci6n" cuando el #or$ulario lla$a un

post sore el controlador" te gustaría conocer si el estado del $odelo es correcto o no. Esto

puede %acerse veri#icando con la propiedad ModelState.svalid. Si la propiedad es v8lida entonce

lla$a a procedi$iento de guardar o $uestra la vista KPostCusto$er ?Solo $uestra los datos del

#or$ulario@" en caso sea #also entonces retorna a la vista original KBo$e" a continuaci6n se

$uestra el c6digo del controlador.

50


51/134


Paso .: Probando la A!licación$

Dinal$ente presionar Ctrl D0" y al enviar el control en lanco $ostrar el $ensa3e de error" pero

esta validaci6n se reali+a en el servidor" por1ue el controlador es 1uien valida.

%ota: Note 1ue se e3ecut6 la acci6n post al $>todo del controlador PostCustoer

Paso : =abilitando la (alidación en el cliente

En los pasos anteriores las validaciones se reali+an en el lado del servidor" esto signi#ica 1ue

al $o$ento de enviar el #or$ulario 1ue contiene errores de validaci6n" el control pasa al

servidor solo para regresar con $ensa3es de error. para evitar este ida y vuelta se puede agregar

51


52/134


capacidades del lado del cliente en la vista Bo$e.cs%t$l.

)a validaci6n en el cliente se puede reali+ar con 3/uery 'notrusive Validation" para lo cual %ay

1ue re#erenciarlo en nuestro proyecto. E3ecutar el siguiente co$ando en Package Manager

Console ?Berra$ientasHAd$inistrador de pa1uetes de Uilioteca@ : PMG nstallPackage

3/uery.Validation.'notrusive.

A%ora" uicar el arc%ivo 2e.con#ig arirlo y asegurar 1ue e4isten las siguientes teclas de la

secci6n RappSettingsG las claves ClientValidationEnaled y 'notrusive-avaScriptEnaled asignar

el valor true:

'tili+ar el ayudante 'rl.Content?@ para otener las direcciones '() de los tres arc%ivos de script"

a saer. 31uery!.,.,.3s" 31uery.validate.3s y 31uery.validate.unotrusive.3s. Estos arc%ivos son

necesarios para llevar a cao la validaci6n del lado del cliente ?%o$e.cs%t$l@.

Paso 6: Probando la A!licación$

Dinal$ente presionar Ctrl D0" entonces la al presionar el ot6n enviar la validaci6n lo reali+ar8

en el cliente sin ir al servidor.

52


53/134


tros atriutos de anotaci6n de datos

)a pruea resultaría:

53


54/134


Lab +,: MVC . > 9aor

Basta a%ora este artículo ya estuvo usando (a+or. /u> es (a+or9 sola para dar una respuesta

corta. Este es un tipo de vista para MVC. El prole$a desde el punto de vista e Dor$ este no

se %i+o pensando en MVC" por lo 1ue la sinta4is es un poco pesado.

Paso +: Practica con sinta8is 9aor

A%ora 1ue ya tene$os una idea de lo 1ue es (a+or va$os e3ecutar algunas sinta4is co$unes (a+or

y tratar a tener una idea de lo #8cil 1ue es (a+or co$parado con las vistas ASP.

54


55/134


Práctica +: #i!le l@nea de código

Si 1uieres $ostrar una si$ple variale puedes %acer algunas cosas co$o se $uestra en el c6digo

de aa3o. Todos la sinta4is (a+or e$pie+a con W. Si tiene una si$ple linea de codigo no necesitas

KJ. (a+or se da cuenta de la conclusi6n l6gica.

Si co$paras la sinta4is de arria con una vista ASP" necesitas tipear el c6digo siguiente. Asi 1ue

No es una sinta4is $8s si$ple" ordenado y ligero9.

Práctica ,: Mlti!les l@neas de código

Práctica -: bucle 1oreac" y condición 4'

para ucles y condiciones i# llega a ser $8s si$ple co$o se $uestra en el siguiente c6digo:

Práctica .: %o te !reocu!es !or B

Si est8s pensando si (a+or es con#uso con W de (a+or y W de una direcci6n e$ail" no te

preocupes" (a+or entiende la di#erencia. Para instanciar en la siguiente línea" la pri$era linea

(a+or e3ecutar8 co$o un c6digo y la segunda linea de codigo lo entiende solo co$o una direcci6n

e$ail.

55


56/134


Práctica : Mostrar B

En caso 1uieras $ostrar KW solo tipea esto cada ve+ co$o se $uestra en el siguiente codigo.

se$ostrar8a la siguiente i$agen.

Práctica 6: Mostrar =TML con 9aor

En caso 1uieras $ostrar BTM) en el ro2ser. para instanciar una si$ple variale lla$ada co$o

link el cual tiene c6digo BTM). Estoy $ostrando la variale link en el ro2ser.

Si e3ecutas el c6digo de arria" te sorprenderias ver 1ue este no se $uestra co$o BTM)" sino

co$o una si$ple pantalla co$o se $uestra a continuaci6n. a%ora co$o se $uestra

acontinuaci6n" A%ora eso no es lo 1ue espera$os. Nos esper8a$os una pantalla BTM) adecuado.

Esto se %ace $ediante (a+or para evitar ata1ues SS ?Balare$os de esto en secciones

posteriores@.

Pero no te preocupes" el e1uipo de (a+or se %a %ec%o cargo de esto. Puedes usar Bt$l.(a2

para $ostrar" la $is$a 1ue se $uestra en el siguiente c6digo:

56


57/134


Lab +-: #eguridad MVC Dindo5s Aut"enticationE$

)a seguridad es una de las cosas $8s i$portantes en cual1uier aplicaci6n independiente$ente"

1uien los desarrolla" en cual1uier tecnología" lo $is$o puede decirse de MVC.

Antes de e$pe+ar este laoratorio una cosa 1ue necesita$os entender es 1ue MVC al #inal del día

se encuentra en el $otor ASP.NET.

%ota: En este artículo no va$os a estar uscando en los #unda$entos de la autenticaci6n de

2indo2s y #or$s.

Va$os a i$ple$entar autenticaci6n indo2s en una aplicaci6n MVC ,.

A%ora" una $anera de i$ple$entar autenticaci6n 2indo2s es reali+ando algunos ca$ios en

nuestro proyecto.

Paso +: =abilitar la autenticación Dindo5s$

El pri$er paso es %ailitar la autenticaci6n indo2. Esto lo reali+a$os en el arc%ivo de

con#iguraci6n e.con#ig usando la eti1ueta aut%entication y aut%ori+ation 1ue se $uestra a

continuaci6n:

57


58/134


Paso ,: #olo algunos de'ectos$

En la plantilla MVC ," %ay un pe1ueIo de#ecto. Esto e3ecuta la autenticaci6n Dor$s por de#ecto.

Estale+ca las eti1uetas dea3o de la eti1ueta appsetings para evitar prole$as.

Paso -: A!licando etiFuetas de autoriación en las acciones del controlador$

una ve+ 1ue tienes %ailitado la autenticaci6n indo2s en el e.con#ig" usar la eti1ueta

KXAut%ori+eY y especi#icar cu8les usuarios pueden tener accesoa los controladores y sus

acciones.

58


59/134


Por #avor note 1ue el usuario deeria estar presente en su 2indo2s Active irectory o su grupo

local ?en $i caso uso 2indo2s < y en el ad$inistrador de usuarios y grupos click derec%o en

E1uipoG Ad$inistrar@" co$o en $i caso el usuario ronald es $i usuario de grupo local.

Paso .: Crear A!licación en el #er(idor 44# ; 4nternet 4n'oration #er(erE

Tienes 1ue asegurarte 1ue tienes instalado el S en su e1uipo para lo cual lo puede veri#icar en el

Panel de ControlG Agregar o 1uitar Progra$asG Activar características de 2indo2s.

59


60/134


'na ve+ agregado la característica anterior" a%ora va$os a crear la aplicaci6n en el S con la

%ailitaci6n de autenticaci6n indo2s sola$ente.

Carga$os en ad$inistrador de S y agrega$os aplicaci6n con el no$re MvcTerceria" crea$os

un directorio MVCZNS en donde se pulicaran nuestra aplicaci6n desde Visual Studio?esto

lo vere$os en el siguiente paso@ .

60


61/134


Bailita$os la autenticaci6n indo2s en nuestra aplicaci6n creada" seleccionando la opci6n

Autenticaci6n.

Paso : Publicando nuestra A!licación

'na ve+ 1ue %a+ creado la aplicaci6n en S" es tie$po de pulicar la aplicaci6n a la carpeta de

aplicaci6n 2e. Para lo cual %ace$os click derec%o sore el proyecto ? E4plorador de proyectos

de Visual Studio@ y selecciona$os Pulicar.

)e da$os la ruta ?creada en el paso anterior" cuando crea$os la aplicaci6n en S@ y le da$os en

pulicar.

61


62/134


Paso 6: &2ecutar el controlador y la acción

Dinal$ente e3ecutar el controlador y la acci6n ?en el navegador digitarlo directa$ente@ y ver

co$o el cuadro de autenticaci6n indo2 para el ingreso del usuario y la contraseIa. Esto

validar8 de acuerdo a la autori+aci6n 1ue se asign6 en el controlador Bo$e.

Si las credenciales son ingresados apropiada$ente" deerías ser capa+ de ver lo siguiente:

62


63/134


Lab +.: #eguridad MVC 1ors Aut"enticationE

En el laoratorio anterior vi$os co$o %acer autenticaci6n 2indo2s. )a autenticaci6n indo2s es

ideal para sitios 2e de intranet. Pero co$o pronto %alare$os acerca de sitios 2e para

internet" crear y validar usuarios de 2indo2s Active irectoryHtraa3ar con grupos de usuarios no

es una opci6n #actile. Entonces en este tipo de escenarios KDor$s aut%entication es la $anera

a seguir.

Paso +: /e'inir la !agina Login y su controlador$

)a pri$era cosa 1ue necesita$os es de#inir el controlador el cual invocar8 la vista login.

así tengo creado una si$ple acci6n inde4 el cual invoca una vista lla$ado )ogin. Esta vista )ogin

to$ar8 entradas co$o userna$e y pass2ord.

Paso ,: Creando la (ista Login$

El siguiente paso es crear el #or$ulario )ogin el cual to$ar8 el userna$e y pass2ord. Para crear

el #or$ulario y %e usado la vista ra+or y las clases BTM) %elperI En caso tu eres nuevo en clases

BTM) %elper por #avor revisar el )a !&.

Este #or$ulario BTM) %ace un post a la acci6n K)ogin del controlador KBo$e y es usa el

$>todo Post. Así cuando los usuarios presionan el oton enviar" este lan+ara la acci6n Kinde4.

63


64/134


Paso -: Validar las credenciales$

En la acci6n nde4 la pri$era cosa 1ue necesita$os %acer es veri#icar si el usuario es correcto o

no. Por a%ora tene$os en c6digo el usuario y contraseIa. Esto puede sie$pre ser ree$pla+ado

por consultas del servidor S/) o otra #uente.

'na ve+ 1ue %e$os veri#icado las credenciales el siguiente paso es usar la #a$osa clase

KDor$sAut%entication y asignar la cookie diciendo 1ue el usuario en correcto.

e $odo 1ue en la siguiente solicitud cuando el usuario llegue no tendr8 1ue ser validado una y

otra ve+. espues de 1ue la cookie se estalece es redireccionado a la vista KAout o de lo

contrario te 1uedes en la vista )ogin.

Paso .: Atributo Aut"orie

Ta$i>n necesita$os usar el atriuto KXAut%ori+eY dentro los controladores" los cuales 1uere$os

restringir para los usuarios no autori+ados.

Por e3e$plo se puede ver el siguiente c6digo para la acci6n Knde4 del controlador KBo$e 1ue

esta decorada con el atriuto KAut%ori+e.

64


65/134


Si cual1uier usuario no autori+ado" accede directa$ente a cual1uiera de estos controladores ellos

ser8n enviados a la vista )ogin es decir detr8s del nde4.

Paso : Cabiar el arc"i(o 5eb$con'ig

Dinal$ente necesita$os %acer ca$io en el #a$oso arc%ivo K2e.con#ig es decir %ailitar la

seguridad KDor$s. la parte $as i$portante en el c6digo de aa3o es la propiedad K)ogin'rl.

Paso 6: Veos la acción en Autenticación 1ors$

Si a%ora lla$as a inde4 este directa$ente se $uestra la vista )ogin" este test pruea 1ue la

autenticaci6n KDor$s esta traa3ando.

65


66/134


TUT: Aprender ASP .NET MVC Paso aPaso en 7 dias (D


67/134




67

http://maninformatic.blogspot.com/2014/06/aprender-asp-net-mvc-paso-paso-en-7_7.htmlhttp://maninformatic.blogspot.com/2014/08/tut-aprender-asp-net-mvc-paso-paso-en-7.html?showComment=1434381214351#c6150926683497608148http://maninformatic.blogspot.com/2014/06/aprender-asp-net-mvc-paso-paso-en-7_7.htmlhttp://maninformatic.blogspot.com/2014/08/tut-aprender-asp-net-mvc-paso-paso-en-7.html?showComment=1434381214351#c6150926683497608148


68/134


Lab +: G#%H MVC y GIuery

En caso seas nuevo en -SN por #avor lee esto antes e$pe+ar con este laoratorio" Acerca de

-SN.

En este laoratorio va$os a e4poner un si$ple o3eto KCusto$er de MVC en #or$ato -SN y

consu$i$os el $is$o usando -1uery.

Para este laoratorio por #avor asegurarse 1ue el proyecto el no$re del proyecto se

MvcCuartoia y crearse use la plantilla de proyecto 8sico esto es necesario para incluir las

lirerías -1uery en el proyecto MVC.

Paso +: Crear un si!le odelo Custoer

El pri$er paso es crear una si$ple clase $odelo KCusto$er en el proyecto.

68

http://maninformatic.blogspot.com/2014/01/tip-acerca-de-json.htmlhttp://maninformatic.blogspot.com/2014/01/tip-acerca-de-json.htmlhttp://maninformatic.blogspot.com/2014/01/tip-acerca-de-json.htmlhttp://maninformatic.blogspot.com/2014/01/tip-acerca-de-json.html


69/134


Paso ,: &8!oner el ob2eto JCustoerK coo G#%

A%ora agrega$os un controlador KCusto$er" para e4poner el o3eto custo$er en #or$ato -SN

necesita$os usar K-son(esult co$o se $uestra en el siguiente c6digo.

Por #avor" e3ecute el controlador con la acci6n -SN anterior para co$proar 1ue el resultado

-SN se $uestra correcta$ente. Si estas usando C%ro$e el resultado se $uestra en el navegador"

si este es nternet E4plorer este descargara un arc%ivo.

Paso -: Consuiendo el controlador G#% en GFuery

En caso seas nuevo en -1uery" por #avor leer esto /ue es -1uery9

El siguiente paso es consu$ir los datos -SN usando una vista MVC. Asi 1ue adelante AIadi$os

una vista con el no$re Aprender-1uery.cs%t$l

)o pri$ero es agregar la re#erencia a la lireria -1uery en la parte superior de la pagina. en caso

69

http://maninformatic.blogspot.com/2014/01/tip-que-es-jquery.htmlhttp://maninformatic.blogspot.com/2014/01/tip-que-es-jquery.html


70/134


no encuentras 31uery en el proyecto esto signi#ica 1ue no %as creado el proyecto usando la

plantilla asica o sino puedes instalarlo de #or$a $anual usando la Consola de Ad$inistracion de

pa1uetes de Visual Studio" esto lo e4plico al detalle en el artículo cargar vistas parciales en

ASP.NET MVC usando -1uery A3a4 o ta$ien usando CN co$o lo e4plico es este tips de CN.

'sando sinta4is %t$l

'sando sinta4is ra+or

Puedes entonces %acer una lla$ada al controlador 1ue esta e4poniendo en #or$ato -SN usando

el $>todo Kget-son co$o se $uestra $8s aa3o. Este to$a tres par8$etros:

El pri$er par8$etro en Kget-son es el '() MVC -SN con el #or$ato de estructura

controllerHaction.

El segundo par8$etro es la data a ser pasada. Por a%ora esto es nulo co$o esta$os $8s

interesados en otener datos -SN en lugar de pulicar los datos.

El ulti$o para$etro es el $>todo de devoluci6n de lla$ada Kisplay el cual ser8 invocado cada

ve+ 1ue otenga$os datos -SN del controlador. )a #unci6n isplay ta$i>n est8 disponile en

el siguiente c6digo. Estoy asignando una alerta con la propiedad na$e. puedes ver co$o

sola$ente tipeo data.Custo$erCode" no convierto los datos -SN estos son auto$8tica$ente

convertidos a o3etos 3avascript.

70

http://maninformatic.blogspot.com/2014/01/como-cargar-vistas-parciales-en-aspnet.htmlhttp://maninformatic.blogspot.com/2014/01/como-cargar-vistas-parciales-en-aspnet.htmlhttp://maninformatic.blogspot.com/2014/01/cdn-o-link-para-algunos-componentes-web.htmlhttp://maninformatic.blogspot.com/2014/01/como-cargar-vistas-parciales-en-aspnet.htmlhttp://maninformatic.blogspot.com/2014/01/como-cargar-vistas-parciales-en-aspnet.htmlhttp://maninformatic.blogspot.com/2014/01/cdn-o-link-para-algunos-componentes-web.html


71/134


El c6digo co$pleto en la vista MVC lo $ostra$os aa3o. Se creado un si$ple ot6n BTM) y dentro

el evento click en donde se est8 lla$ando al $>todo 3avascript Kget-son el $is$o 1ue %ace una

lla$ada al controlador -SN y $uestra la data -SN en una alerta 3avascript.

)a vista anterior es invocado usando el $>todo KMostrar-son del controlador Custo$er creado

anterior$ente.

71


72/134


Paso .: &2ecutar la a!licación y (er el dato

espu>s de %aer %ec%o todos los pasos es %ora de e3ecutar el proyecto ?CtrlD0@ y digitar en la

url %ttp:HHlocal%ost:0;*5;HCusto$erH$ostrar-son para ver la elle+a -SN en e3ecuci6n.

Lab +6: 7estión de #esion en MVC Vie5/ataH Vie5agH Te!/ata y (ariables sesiónE

)a $eta principal en MVC es crear aplicaciones 2e y aplicaciones 2e usando el protocolo BTTP.

Cuando envías una solicitud a la aplicaci6n MVC se atiende la solicitud y se olvida de la solicitud.

)a pr64i$a ve+ 1ue el $is$o usuario envía la solicitud MVC lo trata co$o una co$pleta nueva

solicitud.

A%ora piensa en la siguiente situaci6n:

• El usuario #inal envía la solicitud al sitio MVC

• MVC envía una pagina de logueo

• El usuario ingresa detalles adecuados y envía los datos a la aplicaci6n MVC.

• MVC valida el usuario y enviar la p8gina inicial del sitio. )a aplicaci6n MVC a%ora se olvida

todo lo relacionado con el usuario ya 1ue es ap8trida.

• El usuario %ace clic en uno de los link de la p8gina inicial. Esto es enviado a la aplicaci6n

MVC y por1ue la aplicaci6n MVC se %a olvidados de todo lo relacionado con el usuario" le

72


73/134


envía una p8gina de inicio de sesi6n para la autenticaci6n de nuevo[ el usuario se sentir8

e4traIo..

Este resu$en necesita$os tener algunos tipos de $ecanis$os el cual nos ayudara a recordar

estados entre la solicitud y la respuesta de MVC.

Bay * $aneras de $antener estados en MVC y estas $aneras puede ser usado dependiendo de

1ue capa a 1u> capa se navegas.

Te! /ata: Ayuda a $antener los datos sore las redirecciones para una Fnica solicitud y

respuesta. A%ora la redirecci6n puede ser de controlador a controlador o de controlador a vista.

Vie5 /ata: Ayuda a $antener datos cuando se $ueve de controlador a la vista.

Vie5 ag: Este es un contenedor din8$ico alrededor de vista de datos. Cuando usa$os el tipo

Kvie2ag la conversi6n no es re1uerido. 'tili+a una clave din8$ica interna.

73


74/134


Variables sesión: 'sando variales sesi6n pode$os $antener datos %asta cerrar el navegador.

e$ostrare$os los #unda$entos anteriores con una de$ostraci6n.

Paso +: Crear dos controladores J/e'ault+K y J/e'ault,K$

Agregar dos controladores e#ault! y e#ault&.

Paso ,: &stablecer #esionH te!dataH (ie5data y (ie5bag

En el controlador Ke#ault! dentro del $>todo Knde4 asigna$os valores a sesi6n" te$pdata"

vie2data y vie2ag co$o se $uestra en el siguiente c6digo. 'na ve+ 1ue %e$os asignado los

valores %ace$os una redirecci6n a la acci6n KAlgunatraAccion el cual pertenece al controlador

Ke#ault&.

74


75/134


Paso -: Leer (alores sesiónH te!dataH (ie5data y (ie5bag

En el controlador Ke#ault& captura$os para leer valores asignados en el controladorKe#ault!. 'na ve+ 1ue los valores son leídos invoca$os a la vista lla$ada KVistaatos.

Por #avor note 1ue se esta asignando KVie2ata y KVie2Uag antes de redireccionar a la vista.

)a vista KVistaatos solo $uestra los datos presentados en KTe$pata" KVie2data" KVie2Uag

y KSession.

75


76/134


Va$o a %ailitar un punto de depuraci6n en las acciones de a$os controladores y va$os a ir al

controlador e#ualt! y a su $>todo nde4 %ttp:HHlocal%ost:0;*5;Hde#ault!Hinde4 . En esta acci6n

las sesi6n" te$pdata" vie2data y vie2ag son cargadas. ea3o pode$os ver co$o se $uestran

los datos.

A%ora de a1uí va$os a redireccionar al controlador Ke#ault& acci6n KAlgunatraAccion.

En el controlador pode$os ver 1ue otene$os las variales KTe$pata y KSession pero no

KVie2ata y KVie2Uag ?Ver str* y str, con asignados null@. En otras palaras KVie2ata y

76


77/134


KVie2Uag no %acen persistencia de datos en redirecci6n $ientras KTe$pata y KSession si lo

%acen.

Cuando la vista se invoca pode$os ver todos los datos. En otras palaras los datos KVie2ata y

KVie2Uag persistieron del controlador a la vista. \ ta$i>n los datos KTe$pata y KSession

persistieron.

77


78/134


A%ora cuando la vista vista invocada %e agregado un Biperlnk KBa+$e Click el cual invoca a la

acci6n Knde4 del controlador Ke#ault!. Esto es para si$ular una nueva solicitud.

Cuando se %ace click en el %ipenvinculo. Todas las otras variales se apagan" solo la variale

KSession persiste.)o pode$os ver en la #igura siguiente. Esto signi#ica 1ue las variales KSession

pueden persistir entre solicitudes.

ea3o est8 una tala resu$en 1ue $uestra los di#erentes $ecanis$o de persistencia.

78


79/134


Lab +3: Controler As@ncronos

)as aplicaciones MVC al #inal del día son aplicaciones 2e los cuales son %ospedados dentro de

S. A%ora cuando cual1uier solicitud llega al controlador MVC este genera un %ilo del %ilo pool y

sirve a esta petici6n. En otras palaras el servidor e S $antiene un grupo de %ilos en lugar de

crear %ilos a partir de cero una y otra ve+ para otener ene#icios de rendi$ientos.

Va$os asu$ir 1ue un servidor 2e %a creado un pool de %ilos de ta$aIo &. A%ora esto es solo una

suposici6n por1ue un pool de ta$aIo & es $uy %ipot>tico. Pero para %acer cosas si$ples

considera$os 1ue los pool de %ilos son de ta$aIo &.

Va$os a decir pri$ero 1ue la solicitud llega al sitio" S tira un o3eto de pool de %ilo ya reali+ado

y e$pie+a a servir la petici6n. Mientras tanto va$o a decir llega la segunda solicitud en lo 1ue de

nuevo el S se tira un %ilo del pool de %ilo y e$pie+a a servir la segunda petici6n.

A%ora lo divertido e$pie+a cuando llega la tercera solicitud. El servidor S no tiene $8s o3etos

de %ilos en el pool co$o ya ya %an sido servidos a Kre1uest! y Kre1uest&. Asi 1ue el servidor

solo $ueve la tercera solicitud a un $odo de espera o el servidor puede enviar un $ensa3e 0;*

ocupado para el cliente.

79


80/134


Esta situaci6n es deno$inado co$o KT%read Starvation. )as situaci6n T%read Starvation se

pueden superar al %acer la solicitud KAsincrona. Así 1ue la petici6n llega e in$ediata$ente la

solicitud se procesa de $anera KAsincrona y soltando el %ilo 1ue sirva la solicitud

in$ediata$ente.

Así 1ue para evitar esto pode$os lograr lo $is$o" %aciendo nuestros controladores KAsincronos.

A%ora va$os a entender paso a paso co$o i$ple$entar controladores asíncronos en MVC.

Paso +: =eredar de la clase AsyncController

Considerando la siguiente clase controlador KBeavyController el cual tiene una acci6n

KAlgunMetodoBeavy y esta acci6n espera &; segundos. Así 1ue va$os a entender c6$o pode$os

%acer este si$ple controlador Async%.

Así 1ue el pri$er paso es %eredar de la clase KAsyncController.

Paso ,: Marcar todos con el ane8o Async

El siguiente paso es aIadir la palara Async despu>s de los $>todos. Asi co$o pode$os oservar

KAlgunMetodoBeavy %a sido ca$iado a KAlgunMetodoBeavyAsync.

)a l6gica de c6digo de Beavy es decir KT%read.Sleep?@ is $ovido a un $etodo di#erente y este

$>todo es invocado usando la tarea de la lirería paralela de KAlgunMetodoBeavyAsync.

Cada ve+ 1ue una KTask o un KT%read es iniciado nosotros incre$enta$os el contador de

utstandingperations pero usando KAsyncManager y cada ve+ 1ue una tarea $ultit%readed es

co$pletada decre$enta$os el contador.

80


81/134


Paso -: Crear el todo co!letado

A%ora una ve+ todas las tareas $ultit%readed co$pletadas y el utstandingperations esta cero

necesita$os retornar la vista. Asi para el $is$o necesita$os crear un $etodo Action(esult con la

palara Co$pleted ane4ada. Este $>todo se lla$a cuando todas utstandinperations son cero.

Paso .: Asegurarse de crear la (ista JAlgunMetodo=ea(y$cs"tlK

Ta$i>n asegurarse de agregar la vista KAlgunMetodoBeavy con el siguiente te4to dentro.

81


82/134


Paso : &2ecutar y dis'rutar

A%ora digitar en el navegador K%ttp:HHlocal%ost:0;*5;H%eavyHAlgunMetodoBeavy y ver la

salida.

82


83/134


TUT: Aprender ASP .NET MVC Paso aPaso en 7 d


84/134


• *a# 1: Rrea MVC

• ¿Bue $a- para e se%o d


85/134


"ab 1>: Em#aquetado & *ini7icaci$n en *+C

A'#os !on!ep%os e'paque%ado - 'ini8i!a!i+n a-udan a in!re'en%ar e rendi'ien%o

Entendiendo el Em#aquetado

Sie'pre os pro-e!%os He# ne!esi%an ar!$i5os CSS - Ga5aS!rip%. Nor'a'en%e sereaia una pe%i!i+n a ser5idor por !ada ar!$i5o CSS - Ga5aS!rip%0 - si se %ienen5arios de es%os ar!$i5os $a!e que a !ar,a de as p;,inas sean en%as. E'paque%arosnos a-uda a !o'#inar '%ipes ar!$i5os Ga5aS!rip% - CSS en un soo o#e%o en%ie'po de ee!u!i+n0 !o'#inando as< '%ipes soi!i%udes en una soa soi!i%ud que asu 5e a-uda a 'eorar e rendi'ien%o.Por ee'po !onsidere a soi!i%ud de una p;,ina en a si,uien%e i'a,en. *assoi!i%udes son !ap%urados usando a /erra'ien%a de desarroo de C$ro'e. Es%ap;,ina !onsu'e ar!$i5os 3Ga5as!rip%1.s4 - 3Ga5as!rip%.s4. Cuando es%a p;,ina essoi!i%ada es%a $a!e %res pe%i!iones a ser5idor.

• Pri'era para a p;,ina 3nde4

• Se,unda soi!i%ud para e ar!$i5o Ga5aS!rip% 3Ga5as!rip%1.s4

• Ter!era soi!i%ud para e ar!$i5o Ga5aS!rip% 3Ga5as!rip%.s4

A$ora si piensas un po!o en e es!enario de arri#a puede e,ar a ser peor si%ene'os 'u!$os ar!$i5os a5as!rip% (espe!ia'en%e ar!$i5os GBuer-) resu%ado'%ipes soi!i%udes que redu!ir


86/134


Entendiendo la *ini7icaci$n

*a 'ini8i!a!i+n redu!e e %a'a>o de os ar!$i5os s!rip% - CSS0 ei'inando espa!ios en#an!o0 !o'en%arios0 e%!. Para e ee'po de a#ao %ene'os un si'pe !+di,o

a5as!rip% !on !o'en%arios.

Después de api!ar a 'ini8i!a!i+n os !odi,o a5as!rip% se 5eran !o'o en a i'a,ende a#ao. puedes 5er !o'o son ei'inado os espa!ios en #an!o - !o'en%arios para'ini'iar e %a'a>o de ar!$i5o e in!re'en%ar e rendi'ien%o de#ido a que e %a'a>ode ar!$i5o $a sido redu!ido - !o'pri'ido.

Va'os a de'os%rar un si'pe ee'po de e'paque%ado - 'ini8i!a!i+n !on MVC pasoa paso.

Paso 1: Crear un #ro&ecto con la #lantilla en blanco

Para en%ender e e'paque%ado - 'ini8i!a!i+n0 5a'os a se,uir adean%e - !reare'osun pro-e!%o MVC en #an!o. En es%e 5a'os a a,re,ar una !arpe%a 3S!rip%4 - den%ro de es%e0 5a'os a a,re,ar dos ar!$i5os a5as!rip% !o'o se 'ues%ra en a si,uien%e8i,ura.

86


87/134


E si,uien%e !+di,o es para e ar!$i5o 3Ga5aS!rip%1.s4

E si,uien%e !+di,o es para e ar!$i5o 3Ga5aS!rip%.s4

Paso !: Crear un controlador que llame a una 4ista

A$ora 5a'os a se,uir - !rear a un !on%roador e !ua a'e a una 5is%a a'ada3MiVis%a4 es !ua !onsu'e a'#os ar!$i5os a5as!rip%.

87


88/134


A,re,a'os a 5is%a MiVis%a - !onsu'i'os os ar!$i5os a5as!rip%.

88


89/134


Paso 3: E6ecutar & 4er como se hacen multi#les llamadas

A$ora ee!u%a'os a api!a!i+n MVC en oo,e C$ro'e0 Presione a !o'#ina!i+n de%e!as C%rKS$i8%K para 5er a si,uien%e saida. Puedes o#ser5ar que $a- %ressoi!i%udes.

Paso 5: /e7erenciando a S&stem.eb.@#timi=ation2

E e'paque%ado - 'ini8i!a!i+n es $e!$o por e na'espa!e3S-s%e'.He#.p%i'ia%ion4. A$ora es%e D** no es par%e de 8ra'eFor@ .NET o

ASP.NET. Ne!esi%a'os usar NUET para des!ar,ar es%a D**. Va'os a NUET -#us!ar ASPNET.He#.p%i'ia%ion.NUET es una $erra'ien%a !ien%e0 que se a,re,a a Visua S%udio - nos per'i%ead'inis%rar - !onsu'ir paque%es. *a ,aer


90/134


Paso 5: El archi4o de con7i%uraci$n de #aquete

A$ora es%e paso depende de que %ipo de pan%ia MVC $e'os see!!ionado a a $orade !rear nues%ro pro-e!%o. Si $u#iéra'os see!!ionado a pan%ia 3?asi!4 en%on!es ear!$i5o 3?undeCon8i,4 -a se !rearia - !o'o noso%ros $e'os see!!ionado a pan%ia

3?an!o4 en%on!es %ene'os 'u!$o %ra#ao que reaiar.

En%on!es si,a'os - a,re,ue'os a !ase 3?undeCon8i,4 - !ree'os un 'é%odo3e,is%er?undes4 !o'o se 'ues%ra en e si,uien%e !+di,o.En e !+di,o de a#ao3#undes.add4 di!e que a,re,ue %odos os ar!$i5os a5as!rip% que es%;n den%ro de a!arpe%a 3S!rip%s4 a un paque%e a'ado 3?undes4.

Nota im#ortante: No o5idar i'por%ar e na'espa!es 3S-s%e'.He#.p%i'ia%ion4 o deo !on%rario se ,enera un error.

90


91/134


Paso :"lamar el archi4o de con7i%uracion del em#aquetado desde el archi4o%lobal.asaB.cs

En es%e paso no es ne!esario si se $a !reado e pro-e!%o u%iiando a pan%ia MVC3?;si!o44. Pero !o'o noso%ros $e'os !reado e pro-e!%o u%iiando a pan%ia MVC3?an!o40 en%on!es %ene'os que a#rir e ar!$i5o ,o#a.asa.!s - en e ini!io de a

api!a!i+n a'ar e 'é%odo 3e,is%er?udes4 !o'o se 'ues%ra en e si,uien%e !+di,o.

Paso : Enla=ar el em#aquetado en la 4ista

Una 5e que e e'paque%ado es $e!$o ne!esi%a'os ei'inar e %a, 3s!rip%4 - a'ar ad 3p%i'ia%ion4 para enaar e e'paque%ado.

De#ao es%a e !odi,o en a !ua e'paque%are'os a'#os ar!$i5o a5as!rip% en unni!o o#e%o0 e5i%ando as< a'ada de soi!i%ud '%ipe por !ada ar!$i5o a5as!rip%. Ene e'paque%ado !o'pe%o se a,re,a a 5is%a MVC.

91


92/134


Paso >: *irar el em#aquetado & mini7icaci$n en tiem#o real.Para 'os%rar e e'paque%ado - 'ini8i!a!i+n en %ie'po rea. Ee!u%a'os nues%ropro-e!%o en oo,e C$ro'e - presiona a !o'#ina!i+n de %e!as CT*KS/ITK(/erra'ien%a de Desarroador) - puedes 5er a 'a,ia a$< en donde se 'ues%ra unasoa a'ada para a'#os ar!$i5os a5as!rip%.

$a!e'os !i!@ en a pes%a>a Pre5ieF pode'os 5er que a'#os ar!$i5os Ga5aS!rip%

$an sido uni8i!ados. si a 'ini8i!a!ion %a'#ién se $a reaiado e!orde'os nues%roar!$i5o a5a s!rip% ori,ina.

Co'o puedes 5er en a saida de a#ao0 os !o'en%arios $an sido ei'inado0 os

espa!ios en #an!o son re'o5idos - e %a'a>o de ar!$i5o se redu!e - es ';se8i!ien%e.

92


93/134


93


94/134


"ab 1D: *odelo +ista *+C

Teora

Una 5is%a 'odeo es una si'pe !ase que represen%a da%os a ser 'os%rados en a5is%a.por ee'po a#ao es%a un si'pe o#e%o Cus%o'erMode !on propiedades3Cus%o'erNa'e4 - 3A'oun%4.

Pero !uando e 'odeo de o#e%o 3Cus%o'er4 es 'os%rado en a 5is%a MVC es%e'ues%ra a,o !o'o se puede o#ser5ar en a si,uien%e 8i,ura. Es%e %iene3Cus%o'erNa'e40 3A'oun%4 - un !a'po pus 3Cus%o'er ?u-in *e5e4.

3Cus%o'er ?u-in, *e5e4 (Ni5e de !o'pra de !ien%es) es un indi!ador de !oor e'is'o que indi!a que %an a,resi5o es a !o'pra de os !ien%es.E !oor de 3Cus%o'er #u-in, *e5e4 depende de 5aor de a propiedad 3A'oun%4. Sia !an%idad es 'a-or que 222 en%on!es e !oor es roo0 si a !an%idad es 'a-or que1922 en%on!es e !oor es anaranado - e !aso !on%rario es !oor es a'ario.En o%ras paa#ras 3Cus%o'er ?u-in, *e5e4 es una propiedad e%ra e !ua es!a!uado en #ase de a a !an%idad (!an%idad).

Por o que a !ase 5ieF'ode 3Cus%o'er4 %iene %res propiedades

• E %e%#o 3T%Cus%o'erNa'e4 %o'a da%os de a propiedad 3Cus%o'erNa'e4

• E %e%#o 3T%A'oun%4 %o'a da%os de a propiedad 3A'oun%4 de 'odeo !o'oes%e es

• 3Cus%o'er?u-in,*e5eCoor4 'ues%ra e 5aor de !oor dependiendo de 5aor3A'oun%4.

94


95/134


¿Fue ti#o de l$%ica contendr la clase 4ie8 model?

*a !ase 5ieF 'ode puede %ener os si,uien%es %ipos de +,i!a:

• "$%ica de trans7ormaci$n de color: Por ee'po %u %ienes una propiedad3rado4 en e 'odeo - %e ,us%aria 'os%rar en a U e !oor roo para e ni5e de,rado a%o0 !oor a'ario para e ni5e de ,rado #ao - 5erde para e ,rado .

• "$%ica de trans7ormaci$n de 7ormato de datos: Si %u 'odeo %iene unapropiedad 3Es%ado4 !on e 5aor 3Casado4 - 3So%ero4. En a U %e ,us%aria 'os%rare !o'o un !$e!@#o e !ua es 'ar!ado si 3!asado4 - des'ar!ado sies 4so%ero4.

• "$%ica de a%re%aci$n: Tienes dos !ase 'odeo di8eren%es 3Cien%e4 -3Dire!!ion4 - %ienes una 5is%a e !ua 'ues%ra a'#os da%os 3Cien%e -3Dire!!i+n4 en una soa 5e.

• Estructura 9o8nsin=in%: Tienes un 'odeo 3Cien%e4 !on propiedades3No'#reCien%e4 - 3Codi,oCien%e4 - quieres 'os%rar soo 4No'#reCien%e4. puedes !rear un 'odeo !on%enedor arededor - eponer as propiedadesne!esarias.

Va'os $a!er un peque>o a#ora%orio para en%ender e !on!ep%o 'odeo de 5is%a MVCusando a si,uien%e 'ues%ra e !ua $e'os dis!u%ido pre5ia'en%e.

Usare e en8oque de arri#a $a!ia a#ao para !rear a pan%aa de arri#a:

• Paso 1: Crear e 'odeo 3Cus%o'er4

• Paso : Crear e VieFMode

• Paso 6: Consu'ir a VieFMode en a 5is%a.

95


96/134


Paso 1: Creando el modelo Customer

Asi 5a'os a se,uir adean%e - !rear un 'odeo 3Cus%o'er40 en nues%ro pro-e!%o3MVCBuin%oDia40 !on as propiedades de a#ao.

Paso !: Creando la 4ista modelo*o si,uien%e es !rear una !ase VieFMode e !ua !on%endr; a 'odeo 3Cus%o'er4 -a,re,ara propiedades de U. Asi que 5a'os a !rear una !arpe%a 3VieFModes4 - enes%a a,re,ar una !ase 3Cus%o'erVieFMode4.

A#ao 5a e !odi,o para a !ase 3Cus%o'erVieFMode4. A$ora a,unos pun%osi'por%an%es a!er!a de a !ase 5ieF 'ode:

96


97/134


• Puedes 5er en a !ase de a#ao !o'o a !ase 3Cus%o'er5ieFMode4 !on%ienea !ase 3Cus%o'erMode4.

• Ta'#ién un pun%o ii'por%an%e que $e'os de !rear propiedades e !ua 5a !ona !on5en!i+n de no'#res de U (%%Na'e0 %%A'oun%0

#Cus%o'er*e5eCoor0e%!).

• A$ora para o 'as i'por%an%e 'irar e !odi,o para a propiedad3Cus%o'ere5eCoor40 es%e 'ues%ra e !oor dependiendo de a !an%idad(A'oun%) de 5en%as de !ien%e (Cus%o'er). Una 3VieFMode4 eis%e para es%e%ipo de !+di,o puen%e0 e !ua !one!%a e 'odeo - a 5is%a.

Paso 3: Consumiendo el +ie8*odel en la 4istaE si,uien%e paso es !rear un !on%roador0 e 'is'o que pasa a,unos da%os !o'o se'ues%ra en e si,uien%e !+di,o.

97


98/134


99/134


Co'o puedes 5er a 5is%a no es%a de!orada o se puede de!ir enaada !on a !ase'odeo. *o ';s i'por%an%e es 'irar que a 5is%a es%; i'pia. Es%o no %iene !+di,o paraa %o'a de de!isiones para a !odi8i!a!i+n de !oores. Es%os !+di,o se $an in!uidoden%ro de a !ase VieFMode. Es%o $a!e que VieF Mode sea un !o'ponen%e esen!iade MVC.

Paso 5: Probando la A#licaci$nUna 5e %er'inado es 'o'en%o de pro#ar a api!a!i+n para o que presiona'osC%rKI9.

99


100/134


+ie8*odel sera Com#osici$n o (erencia

Mu!$os arqui%e!%os !o'e%en errores !reando una !ase VieFMode !o'o $eren!ia. Si%u 5es arri#a a !ase VieFMode es !reado por !o'posi!i+n - no por $eren!ia.

¿Porque !o'posi!i+n %iene ';s sen%ido& si 5isuaias noso%ros nun!a de!i'os 3es%apan%aa es $io de os o#e%os de ne,o!io40 eso sera.Noso%ros de!i'os 3esa pan%aa usa esos 'odeos4. Asi que es 'u- !aro que sea unarea!i+n usando - no una rea!i+n es un (padres e $ios).

A,unos es!enarios donde a $eren!ia 8aara:

• Cuando %u no quieres a,unas propiedades de 'odeo en %u 5is%a.

• Cuando %u %ienes una 5is%a e !ua usa '%ipes 'odeos.

As< que no sean a%ra


101/134


'a,en de $%%p:LL%o'dain,.!o'

+enta6as de +ie8*odel

eusa#iidad. A$ora que e !+di,o $a sido o#e%o de una !ase. Se puede !rear eo#e%o de es%a !ase en !uaquier o%ra %e!noo,


102/134


Cuando se %ra%a de 'aneo de e!ep!iones0 e #oque %r-...!a%!$ es a op!i+n 8a5ori%ade os desarroadores .NET. Por ee'po en e si,uien%e !+di,o $e'os en5ue%o e!+di,o den%ro de %r-..!a%!$ - si $a- e!ep!iones in5o!a'os a una 5is%a 3Error4 en e#oque !a%!$.

E ,ran pro#e'a !on e !+di,o de arri#a es a reusa#iidad de 'aneo de !+di,oe!ep!iones. MVC propor!iona a reu%iiar e !+di,o de 'aneo de e!ep!iones en%res ni5ees:

A tra4)s de acciones dentro del mismo controlador : Puedes usar e e5en%o3nE!ep%ion4 donde es!ri#es a +,i!a e 'is'o que puede ser reu%iiado a %ra5ésde 3A!!iones4 den%ro de 'is'o !on%roador.A tra4)s de cualquier controlador: En MVC pode'os usar 3Ii%erCon8i,4 para !rear un a%ri#u%o e !ua ser; api!ado a !uaquier !on%roador - !uaquier a!!ion.

A ni5e de pro-e!%o: 'aneando Usin,Appi!a%ionError en o#a.asa. As< que!uando a e!ep!i+n se ,enera desde !uaquier par%e de pro-e!%o MVC0 es%e ser;ru%eado a un 'aneador de error !en%ra.

102


103/134


Va'os paso a paso a de'os%rar as 6 'aneras de arri#a de 'aneo de errores enMVC.

Paso 1: A%re%ar un controlador & la acci$n que lan=a el error

As< que o pri'ero es a,re,ar un si'pe !on%roador - a a!!i+n que an!e a,unos

%ipos de e!ep!iones. En e si,uien%e !+di,o puedes 5er que $e'os a,re,ado un!on%roador 3Tes%eandoCon%roador4 !on una a!!i+n 3Tes%earMe%odo40 donde $e'osanado una e!ep!i+n de di5isi+n por !ero.

Por o que si ee!u%ar a a!!i+n an%erior %er'inar; !on un error !o'o se 'ues%ra en a

si,uien%e 8i,ura.

Paso !: Crear una 4ista Error

103


104/134


A$ora una 5e que e error es !ap%urado por !uaquiera de os %res 'é%odos des!ri%osan%erior'en%e nos ,us%ar


105/134


106/134


Paso 5: /eutili=ar a cualquier acci$n & cualquier controlador,;ilterCon7i%

Den%ro de He#.Con8i, si'pe'en%e $a#ii%a'os 3Cus%o'Errors4 !o'o si,ue.

Den%ro de a !arpe%a AppS%ar% a#ri'os Ii%erCon8i,.!s - nos ase,ura'os que/andeErrorA%%ri#u%e es a,re,ado a o#aIi%erCoe!%ion.

/andeErrorA%%ri#u%e en e ni5e ,o#a !on8ir'a que a e!ep!iones anadas por!ada a!!i+n en %odos os !on%roadores ser;n 'aneados.En e ar!$i5o o#a.asa den%ro de Appi!a%ionS%ar% e 'é%odo e,is%ero#aIi%erses in5o!ado.

106


107/134


Es%o $a!e que %odas as e!ep!iones anadas por !uaquier 'é%odo den%ro de %odosos !on%roadores re%ornen a 5is%a 3Error4 presen%e den%ro a !arpe%a S$ared.

Maneo de error a ni5e de !on%roador0 en donde %odos os errores presen%es en asa!!iones de !on%roador 3Tes%eandoCon%roer4 ser;n ad'inis%rados.

Para $a!er que nues%ra 5is%a 3Error4 una 5is%a 8uer%e'en%e %ipada de Modeo

S-s%e'.He#.M5!./andeErrorn8o - en%on!es usar a paa#ra !a5e Mode paraa!!eder a sus 'ie'#ros. Uno de sus 'ie'#ros es e o#e%o E!ep%ion.

107


108/134


E resu%ado ser


109/134


serE6em#lo de reas en el mundo real

*os paises es%an di5ididos por es%ados para que e desarroo - a ad'inis%ra!i+n sea8;!i.

109


110/134


111/134


No%a: E Rrea es una a,rupa!i+n +,i!a no 8


112/134


?us!ar Vis%a por de8e!%o

?us!ar 5is%a Personaiada

112


113/134


TUT: Aprender ASP .NET MVC Paso aPaso en 7 do aor." Sin%ais aor

• *a# Y: Mé%odos de a-uda /%' Personaiado." Creando %u propio 'o%or de

5is%a personaiado.

• ¿Bue $a- para e %i'o d


114/134


Es%e es un 'undo de peque>os disposi%i5os es de!ir '+5ies. Co'o un desarroadorMVC se espera un ,ran apo-o de a pan%ia MVC de Mi!roso8% para e 'is'o. A$oraas pan%aas de es!ri%orio - pan%aas de '+5ies %ienen una a%a 5aria!i+n en %a'a>o.Si nos ,us%arasM+5ies4.

Ta'#ién 5a'os a,re,ar un !on%roador a'ado 4ni!io4 en !ua in5o!ar; a a 5is%a3inde4.

Nota: Puedes 5er en e si,uien%e !+di,o que $e'os !reado un a!%ion resu% !o'oinde. Porque nues%ro no'#re de 5is%a - no'#re de a!!ion son os 'is'os0 noso%rosno ne!esi%a'os pasar e no'#re de a 5is%a den%ro de 3re%urn 5ieF()4.

114


115/134


Paso 0!: Eso es todo as que 4amos a #robar

O es%o es %odo o que ne!esi%a'os $a!er. A$ora 5a'os a ir - pro#ar si e 'odo de5isuaia!i+n MVC $a!e $onor a su pro'esa.

A$ora si 5as e in,resar e !on%roador - a a!!i+n en e na5e,ador 5er;s !o'o ai'a,en iquierda de a#ao. Si in,resas e 'is'o !on%roador - a!!i+n usando ee'uador de '+5ies android %u 5er;s a pan%aa de a i'a,en dere!$a.

Nota: Para pro#ar si'ua!i+n para '+5ies en es%e a#ora%orio $e'os usado esi'uador 3pera Mo#ie4. Tu puedes des!ar,ar e e'uador de$%%p:LLFFF.opera.!o'LesLde5eoperL'o#ie"e'ua%or

115

http://www.opera.com/es/developer/mobile-emulatorhttp://www.opera.com/es/developer/mobile-emulatorhttp://www.opera.com/es/developer/mobile-emulator


116/134


Paso 03: *s #ersonali=aci$n & controlPero que si quere'os ';s personaia!i+n - !on%ro.Si e es!ri%orio 'ues%ra 3nde.!s$%'4Si e '+5i 'ues%ra 3nde.'o#ie.!s$%'4Si e '+5i Android 'ues%ra 3nde.Android.!s$%'4

Tene'os -a i'pe'en%ado as pri'eras dos !ondi!iones. A$ora para a %er!era

!ondi!i+n ne!esi%a'os reaiar a,unos pasos e%ras. eaa%e son a#sou%a'en%e

peque>os - 8;!ies pero !on ,ran resu%ado 8ina.Pri'er paso es a,re,ar una pa,ina 'as 3nde.Android.!s$%'4 espe!ia'en%e para

Android en a !arpe%a Vis%a !o'o se 'ues%ra en a si,uien%e i'a,en.

E si,uien%e paso e $a!er ';s !a'#ios en e ar!$i5o 3o#a.asa.!s4.a. E pri'er paso es a,re,ar e espa!io de no'#re 3S-s%e'.He#.He#Pa,es4 !o'o se'ues%ra en a si,uien%e 8i,ura.

#. Se,undo paso es usar a !ase 3Dispa-ModePro5ider4 - a,re,ar una en%rada3Android4 den%ro de a !oe!!i+n 3Modes4 !o'o se 'ues%ra en e !+di,o de a#ao. Esi,uien%e !+di,o #us!a para a !adena 3Android4 - si en!uen%ra es%o !ap%ura -redire!!iona a a p;,ina 3nde.Android.!s$%'4.

116


117/134


Paso 05: Probar la #ersonali=acion de *o4iles

A$ora si ee!u%as e si'uador de pera Mo#ie !on Android !o'o un usuario a,en%e!o'o se 'ues%ra en a si,uien%e i'a,en0 5eras a pa,ina Android(nde.Android.!s$%') redire!!ionado.

"ab !3: Pro4eedor *+C @Auth

Una de os ';s pro!esos a#urridos para un usuario 8ina es re,is%rase en un si%io. A,unas 5e!es esos ar,os 8or'uarios - !orreos de 5aida!i+n s+o pos%er,a eusuario. En%on!es !+'o $a!er as !osas 8;!ies 'edian%e a 5aida!i+n de os usuarios

117


118/134

asp .net mvc 4 paso a paso en 6 días

Documents