Skip to content

1. Introducción

El PDF de este documento está disponible |AQUÍ|.

Los ejemplos de este documento están disponibles |AQUÍ|.

En este documento nos proponemos presentar, mediante ejemplos, los conceptos importantes de ASP.NET MVC, un marco de trabajo web.NET, que proporciona un marco para desarrollar aplicaciones web según el modelo MVC (Modelo – Vista – Controlador).

Para comprender los ejemplos de este documento se requieren pocos conocimientos previos. Solo se necesitan conocimientos básicos del lenguaje C#. Estos se pueden encontrar en el documento «Introducción al lenguaje C#» en URL [Aprender C# versión 3.0 con .NET Framework 3.5 (2008)]. Se propone un caso práctico para poner en práctica los conocimientos adquiridos en ASP.NET MVC. En él se utiliza el ORM (mapeador objeto-relacional) Entity Framework. Este ORM se presenta en el documento «Introducción a Entity Framework 5 Code First», disponible en el URL [Introducción a Entity Framework 5 Code First a través de ejemplos (2012)].

Este documento está incompleto en muchos aspectos. Para profundizar en ASP.NET MVC, se pueden consultar las siguientes referencias:

  • [ref1]: el libro «Pro ASP.NET MVC 4», escrito por Adam Freeman y publicado por la editorial Apress. Es un libro excelente. Si estuviera disponible en línea de forma gratuita y en francés, este documento no tendría razón de ser. Recomiendo a todos aquellos que puedan hacerlo que se inicien en ASP.NET MVC con la ayuda de este libro. Los códigos fuente de los ejemplos del libro están disponibles de forma gratuita en el URL [http://www.apress.com/9781430242369];
  • [ref2]: la página web del framework [http://www.asp.net/mvc]. Allí encontrarás todo el material necesario para formarte por tu cuenta. Hay una versión en francés disponible en URL [http://dotnet.developpez.com/mvc/ ];
  • la página web de [developpez.com] dedicada a ASP.NET y [http://dotnet.developpez.com/aspnet/ ].

El documento se ha redactado de tal forma que pueda leerse sin necesidad de disponer de un ordenador. Por ello, se incluyen numerosas capturas de pantalla.

1.1. El papel de ASP.NET y MVC en una aplicación web

En primer lugar, situemos ASP.NET MVC en el desarrollo de una aplicación web. En la mayoría de los casos, esta se basará en una arquitectura multicapa como la siguiente:

  • La capa [Web] es la que está en contacto con el usuario de la aplicación web. Este interactúa con la aplicación web a través de páginas web visualizadas por un navegador. Es en esta capa donde se encuentran ASP.NET y MVC, y únicamente en esta capa;
  • la capa [métier] implementa las reglas de gestión de la aplicación, como el cálculo de un salario o de una factura. Esta capa utiliza datos procedentes del usuario a través de la capa [Web] y de SGBD a través de la capa [DAO];
  • La capa [DAO] (objetos de acceso a datos), la capa [ORM] (mapeador objeto-relacional) y el conector ADO.NET gestionan el acceso a los datos de SGBD. La capa [ORM] actúa como puente entre los objetos manipulados por la capa [DAO] y las filas y columnas de las tablas de una base de datos relacional. Actualmente se utilizan dos ORM en todo el mundo: NET, NHibernate (http://sourceforge.net/projects/nhibernate/) y Entity Framework (http://msdn.microsoft.com/en-us/data/ef.aspx);
  • la integración de las capas puede realizarse mediante un contenedor de inyección de dependencias (Dependency Injection Container) como Spring (http://www.springframework.net/);

La mayoría de los ejemplos que se ofrecen a continuación utilizarán una sola capa, la capa [Web]:

No obstante, este documento concluirá con la creación de una aplicación web multicapa:

1.2. El modelo de desarrollo de ASP.NET MVC

ASP.NET MVC implementa el modelo de arquitectura denominado MVC (Modelo – Vista – Controlador) de la siguiente manera:

El procesamiento de una solicitud de un cliente se lleva a cabo de la siguiente manera:

  1. solicitud: las URL solicitadas tienen el formato http://machine:port/contexte/Controlleur/Action/param1/param2/....?p1=v1&p2=v2&.... El [Front Controller] utiliza un archivo de configuración para «enrutar» la solicitud hacia el controlador adecuado y la acción correcta dentro de dicho controlador. Para ello, utiliza la ruta [Controlleur/Action] del URL. El resto de URL y [/param1/param2/...] son parámetros opcionales que se transmitirán a la acción. La C de MVC es, en este caso, la cadena [Front Controller, Contrôleur, Action]. Si la ruta [Controlleur/Action] no conduce a un controlador o una acción existentes, el servidor web responderá que no se ha encontrado la acción solicitada URL.
  1. El procesamiento
  • La acción seleccionada puede utilizar los parámetros parami que le ha transmitido [Front Controller]. Estos pueden proceder de varias fuentes:
  • la ruta [/param1/param2/...] de la acción URL,
  • de los parámetros [p1=v1&p2=v2] del URL,
  • de los parámetros enviados por el navegador junto con su solicitud;
  • al procesar la solicitud del usuario, la acción puede necesitar la capa [métier] [2b]. Una vez procesada la solicitud del cliente, esta puede generar diversas respuestas. Un ejemplo clásico es:
  • una página de error si la solicitud no se ha podido procesar correctamente
  • una página de confirmación en caso contrario
  • la acción solicita que se muestre una vista concreta: [3]. Esta vista mostrará unos datos que se denominan «modelo de la vista». Es la M de MVC. La acción creará este modelo M [2c] y solicitará que se muestre una vista V [3];
  1. respuesta: la vista V seleccionada utiliza el modelo M creado por la acción para inicializar las partes dinámicas de la respuesta HTML que debe enviar al cliente y, a continuación, envía dicha respuesta.

Ahora, precisemos la relación entre la arquitectura web MVC y la arquitectura por capas. Según la definición que se dé al modelo, estos dos conceptos están relacionados o no. Tomemos una aplicación web ASP.NET MVC de una sola capa:

Si implementamos la capa [Web] con ASP.NET y MVC, tendremos una arquitectura web MVC, pero no una arquitectura multicapa. En este caso, la capa [Web] se encargará de todo: presentación, lógica de negocio y acceso a los datos. Serán las acciones las que realicen este trabajo.

Ahora, consideremos una arquitectura web multicapa:

La capa [Web] puede implementarse sin un marco de trabajo y sin seguir el modelo MVC. En este caso, se trata efectivamente de una arquitectura multicapa, pero la capa web no implementa el modelo MVC.

Así, la capa [Web]se puede implementar con ASP.NET y MVC, con lo que se obtiene una arquitectura por capas con una capa [Web] del tipo MVC. Una vez hecho esto, se puede sustituir esta capa ASP.NET MVC por una capa ASP.NET clásica (WebForms), manteniendo el resto (de negocio, DAO, ORM) tal y como está. De este modo, obtenemos una arquitectura por capas con una capa [Web] que ya no es de tipo MVC.

En MVC, hemos dicho que el modelo M era el de la vista V, c.a.d, es decir, el conjunto de datos mostrados por la vista V. Se ofrece otra definición del modelo M de MVC:

Muchos autores consideran que lo que se encuentra a la derecha de la capa [Web] constituye el modelo M de MVC. Para evitar ambigüedades, se puede hablar:

  • del modelo del dominio cuando nos referimos a todo lo que se encuentra a la derecha de la capa [Web]
  • del modelo de la vista cuando nos referimos a los datos mostrados por una vista V

En lo sucesivo, el término «modelo M» se referirá exclusivamente al modelo de una vista V.

1.3. Las herramientas utilizadas

A continuación, utilizamos (septiembre de 2013) las versiones Express de Visual Studio 2012:

  • [http://www.microsoft.com/visualstudio/fra/products/visual-studio-express-for-windows-desktop ] para aplicaciones de escritorio;
  • [http://www.microsoft.com/visualstudio/fra/products/visual-studio-express-for-Web ] para aplicaciones web.

Para instalar las últimas versiones de estos productos, se puede utilizar el producto [Web Platform Installer] de Microsoft (http://www.microsoft.com/Web/downloads/platform.aspx).

Por otra parte, se utilizará el navegador Chrome de Google (http://www.google.fr/intl/fr/chrome/browser/). Se le añadirá la extensión [Advanced Rest Client] . Se puede proceder de la siguiente manera:

 
  • la aplicación estará entonces disponible para su descarga:
  • Para descargarla, tendrás que crear una cuenta de Google. A continuación, [Google Web Store] te pedirá que confirmes [1]:
  • En [2], la extensión añadida está disponible en la opción [Applications] [3]. Esta opción aparece en cada nueva pestaña que crees (CTRL-T) en el navegador.

1.4. Los ejemplos

La mayoría de los ejemplos de aprendizaje se limitarán únicamente a la capa web:

Una vez finalizado este tutorial, presentaremos una aplicación web multicapa:

https://stahe.gihub.io
Este curso-tutorial escrito por Serge Tahé se pone a disposición del público según los términos de la Licencia Creative Commons Reconocimiento – Sin uso comercial – Compartir en las mismas condiciones 3.0 no adaptada.