"ASP.NET Core MVC ofrece una metodología robusta y basada en patrones para desarrollar sitios web dinámicos, facilitando una clara separación de responsabilidades y otorgando un control completo sobre el código HTML, lo cual promueve un desarrollo ágil y satisfactorio."
--Scott Guthrie
En esta sección, profundizamos en el Framework Modelo-Vista-Controlador (MVC), sobre el cual está construido Razor y con el que tiene varios puntos en común. MVC es un patrón de diseño sólido para desarrollar aplicaciones bien diseñadas, comprobables y mantenibles. Las aplicaciones creadas en MVC abarcan:
- Modelos: clases que representan datos de aplicaciones, incorporando lógica de validación para hacer cumplir las reglas del negocio.
- Vistas: archivos de plantilla utilizados para generar dinámicamente respuestas HTML.
- Controladores: clases que administran solicitudes entrantes del navegador, recuperan datos del modelo y seleccionan plantillas de vista para devolver respuestas.
A diferencia de Razor, que organiza el contenido en páginas, MVC utiliza vistas, como se refleja en la estructura de directorios de los nuevos proyectos: los proyectos de Razor tienen un directorio "Pages", mientras que los proyectos MVC tienen un directorio "Views". A pesar de esta diferencia conceptual, ambos marcos utilizan archivos .cshtml para la generación dinámica de páginas usando C#.
Similitudes y diferencias clave
Razor y MVC son tan similares a nivel de vista que pude reutilizar todo el código de las páginas Razor en las vistas MVC simplemente eliminando la directiva @page. Sin embargo, MVC separa explícitamente el modelo de la vista. Razor define el modelo en el archivo .cshtml.cs asociado, mientras que MVC requiere de la creación de objetos que manejen el modelo de forma explícita.
También en
MVC se debe contar con el controlador que es quien recibe las solicitudes desde
la vista y en consecuencia entrega una respuesta obteniendo la información
desde el modelo.
Otra diferencia es que el enrutamiento:
En MVC es de la forma:
/[Controlador]/[Nombre
Acción/[Parámetros]
Mientras
que en Razor es más simple y lógica:
/[Ruta_A_Pagina]/[Página]/[Parámetros]
Ejemplo: En Razor la ruta hacia la página VideoLandingView es:
/BussinesVideoStore/VideosView
En MVC, la
ruta es:
/Videos/VideosView
Protocolo y enrutamiento en MVC
MVC sigue un protocolo para crear controladores y vistas. Por ejemplo, si crea el controlador VideosController, la vista correspondiente debe estar en una subcarpeta de "Views" llamada "Videos" y el archivo de vista (por ejemplo, VideosView) debe coincidir con un método de acción en el controlador. Debido a que tenía ya los nombres para las vistas definidos, la aplicación de este protocolo requirió que algunos nombres de las acciones de los controladores no quedaran como verbos sino como los nombres de las vistas.
Otra limitación de este protocolo es el no poder agrupar vistas en carpetas con fines específicos, una flexibilidad disponible en Razor.
Vistas parciales y View Components
Las vistas parciales son muy similares a las Partial Pages de Razor en ambos casos se trata de archivos colocados en la subcarpeta Shared de extensión .cshtml. Para el caso de MVC, _[Nombre Vista].cshtml.
Para el caso de las View Components en MVC se organizan en la subcarpeta Shared y dentro de esta en una subcarpeta Components y al interior la carpeta con el nombre de la componente y en dicha carpeta la vista con el nombre Default.cshtml y como sucede en Razor también se requiere una clase C# que maneje la lógica de la componente e igual que como ocurre allí su nombre debe tener como sufijo la palabra ViewComponent y debe heredar de ViewComponent. Pero a diferencia que en Razor, esta clase se debe colocar en la carpeta Components que se crea en la raíz de la aplicación.
Ejemplo: En el caso de la aplicación se creó la componente Search y así fue como se organizó al interior del proyecto:
En el caso
de vistas parciales y view components se pudo reutilizar el código cshtml, solo
se eliminó el @Page.
Debido a
que los controladores obtienen la información del modelo, se creo un objeto Helper
inyectable en los controladores responsable de obtener la información para los
distintos controladores, algo similar a un data context, por medio del cual se
obtiene la información de una base de datos.
Este objeto Helper lo que hace básicamente obtener la información para la aplicación de la componente Presenters.
Conexión con la Arquitectura Establecida
La integración de MVC con la arquitectura establecida se muestra a continuación:
En el esquema, el componente Main actúa como el punto de entrada de la aplicación, donde se hace la inyección de dependencias y por ello es que se muestra que tiene dependencia con varias componentes. En MVC, este componente Main corresponde a los archivos Program.cs y Startup.cs.
Nota: En .NET 8 ya solo figura el archivo Program.cs.
Lo interesante aquí es notar como la vista implementada con MVC depende únicamente del componente Presenters.
Aquí está el video de la aplicación construida con MVC:
