El patrón MVC
-
Upload
roberto-luis-bisbe -
Category
Education
-
view
1.699 -
download
0
description
Transcript of El patrón MVC
![Page 1: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/1.jpg)
![Page 2: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/2.jpg)
![Page 3: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/3.jpg)
Agenda
- Qué es MVC (orientado a web)- Ruby on Rails• Introducción a Ruby• Scaffolding con Rails • Rails avanzado
- ASP.net MVC3• Un vistazo rápido a Razor• Introducción al manejo de vistas• Scaffolding con MVC3• ASP.net avanzado
![Page 4: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/4.jpg)
¿Vale, pero qué vamos a hacer?
• Crear un sistema de gestión de eventos
Evento:• Título• Fecha• Descripción• Capacidad• Asistentes (Personas)
Persona:• Nombre• E-mail
![Page 5: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/5.jpg)
1. Introducción
![Page 6: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/6.jpg)
¿Qué es MVC?
• ¿Qué es MVC?
• Según Wikipedia: patrón de arquitectura de software
que separa los datos de una aplicación, la interfaz de
usuario, y la lógica de control en tres componentes
distintos: Modelo-Vista-Controlador
• Para todo tipo de sistemas…
• … y de tecnologías (Java, Ruby, Python, Perl, Flex,
SmallTalk, .Net…)
![Page 7: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/7.jpg)
MModelo
• Representación de los datos del dominio• Lógica de negocio• Mecanismos de persistencia
VVista
• Interfaz de usuario• Elementos de interacción
CControlador
• Intermediario entre Modelo y Vista• Mapea acciones de usuario acciones del Modelo• Selecciona las vistas y les suministra información
Definiendo los roles
![Page 8: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/8.jpg)
Ok
CControlador
MModelo
VVista
CrearEvento(evt)
Crear evento (datos) evt= new Evento()// cargar propiedades
ListarEventos()
Ejecutar vista(«Eventos», Evento[])
Evento[]
HTML
Ejemplo de uso
![Page 9: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/9.jpg)
2. Ruby on Rails
![Page 10: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/10.jpg)
Os presento a RubyEncantado!
• Interpretado
irb(main):001:0> puts «Hola Mundo»Hola Mundo=> nil
irb(main):001:0> a = 16=> 16irb(main):001:0> puts a16=> nil
• Orientado a Objetos
class anfitriondef initialize(nombre = "Mundo")
@nombre = nombreenddef decir_hola
puts "Hola #{@nombre}"end
end
• Dinámico
![Page 11: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/11.jpg)
Una clase con detalles
class anfitriondef initialize(nombres = "Mundo")
@nombres = nombresenddef decir_hola
if @nombres.nil?puts "..."
elsif @nombres.respond_to?("each")@nombres.each do |nombre|
puts "Hola #{nombre}"else
puts "Hola #{@nombres}"end
endend
![Page 12: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/12.jpg)
Cómo crear una web en 4 pasos
1.Inicializar el sitio2.Definir el modelo y generar las
vistas y el controlador3.Generar la base de datos4.Play!
![Page 13: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/13.jpg)
Hemos creado una web en 4 pasos
1.rails new demo2.rails generate scaffold
- evento titulo:string fecha:date descripcion:text capacidad:integer
- persona evento_id:int nombre:string email:string
3.rake db:migrate4.rails server
![Page 14: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/14.jpg)
Vamos a agregar más cosas
1. Relaciones• Relacionar evento con asistentes
2. Validación• Capacidad de las aulas• Presencia del nombre, del e-mail y que no
haya mails repetidos por evento
![Page 15: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/15.jpg)
Resumen
1.Ruby mola!2.Hemos definido un sitio básico de
manera sencilla usando scaffolding3.Hemos agregado relaciones y
validación
![Page 16: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/16.jpg)
3. ASP.net MVC3
![Page 17: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/17.jpg)
• Open Source• Sobre ASP.net• Backend: Visual Basic o C#• Frontend: Razor
Acerca de ASP.net MVC
![Page 18: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/18.jpg)
¿Razor?
Motor de visualización poco intrusivo<ul> @for (var i = 0; i < 5; i++) { <li>@i</li> }</ul>
@{ var name = “Gilberto Salazar”; <div> Nombre: @name </div>}
<html> <head> <title>Simple Layout</title> </head> <body> @RenderBody() </body></html>
@{ Layout = "/Shared/_Layout.cshtml";}
<p> Aquí ponemos el contenido</p>
![Page 19: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/19.jpg)
Ejemplo básico
• Controlador• Definir datos
• Vista• Consumir datos
![Page 20: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/20.jpg)
Sitio web sencillo usando scaffolding*
1.Inicializar el sitio2.Definir el modelo y las relaciones3.Generar las vistas y el controlador4.Generar la base de datos5.Play!
![Page 21: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/21.jpg)
Vamos a agregar más cosas (II)
1. Relaciones• Relacionar evento con asistentes• Mostrar los asistentes de un evento
2. Validación• Validar la presencia del nombre y del e-mail
3. Helpers• Formato a las direcciones de e-mail• Facebook• Twitter
![Page 22: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/22.jpg)
Resumen
• Creado dos modelos• Agregado relaciones• Agregado validación• Enlazado vistas• Agregada interacción a nuestra web mediante
helpers
![Page 23: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/23.jpg)
Recursos
• Ruby-lang.org• Rubyonrails.org• Railsforzombies.org• Live.visitmix.com• Asp.net/mvc
• @rlbisbe• Robertoluis.wordpress.com
![Page 24: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/24.jpg)
• ¿Preguntas?
![Page 25: El patrón MVC](https://reader033.fdocuments.mx/reader033/viewer/2022061210/54919252b47959c6698b458e/html5/thumbnails/25.jpg)
GRACIAS A TODOS!
(que es viernes, y estar aquí tiene mérito!)