Exploración del proyecto de Razor Pages

• 10 minutos

En esta unidad, usará la CLI de .NET Core para compilar y ejecutar una aplicación web. Asimismo, recorrerá la aplicación en ejecución para comprender la experiencia de interfaz de usuario que proporciona.

Examen del proyecto

El directorio del proyecto RazorPagesPizza está abierto actualmente en el editor de Visual Studio Code. En la tabla siguiente se describen los directorios y archivos significativos del proyecto. Examine cada uno de ellos en la ventana del editor de Visual Studio Code.

Archivos de página de Razor y su archivo de clase PageModel emparejado

Por convención, en el directorio Pages se almacenan y organizan todas las instancias de Razor Pages de una aplicación de ASP.NET Core.

Una página de Razor tiene una extensión de archivo .cshtml. Por convención, en su archivo de clase de C# PageModel asociado se usa el mismo nombre, pero con una extensión .cs anexada. Por ejemplo, la página de Razor Index.cshtml tiene un archivo de clase PageModel asociado para Index.cshtml.cs.

Un objeto de modelo define las propiedades de datos y encapsula lógica u operaciones relacionadas con esas propiedades de datos. PageModel es básicamente lo mismo, pero es un modelo que encapsula las propiedades de datos y las operaciones lógicas que se limitan a su página de Razor. La clase PageModel:

• Permite la separación de la lógica de una página de Razor de su presentación.
• Define controladores de página para las solicitudes enviadas a la página y para los datos que se usan para representarla.

Un controlador de página es el método que se ejecuta como resultado de una solicitud HTTP. Por ejemplo, para una solicitud HTTP GET, se ejecutaría de forma automática un método OnGet de la clase PageModel de la página de Razor.

El directorio Pages/Shared

Los elementos de marcado parcial que se comparten entre varias páginas de Razor se encuentran por convención en un directorio Pages/Shared. En la aplicación RazorPagesPizza se usan dos vistas parciales compartidas, que se incluyen al crear un proyecto de aplicación web de ASP.NET Core:

• _Layout.cshtml: proporciona elementos de diseño comunes en varias páginas.
• _ValidationScriptsPartial.cshtml: proporciona funcionalidad de validación, como la validación de entradas de formulario del lado cliente y la validación antifalsificación entre sitios. Esta vista parcial está disponible para todas las páginas del proyecto.

Diseños y archivos de vista parcial

• Diseños: en ASP.NET Core, los diseños son archivos .cshtml en los que se define una plantilla de nivel superior para las vistas de la aplicación. Las aplicaciones no requieren un diseño. Las aplicaciones pueden definir más de un diseño, con otras vistas que especifiquen otros diseños. La mayoría de las aplicaciones web tienen un diseño común que proporciona una experiencia de usuario coherente. El diseño suele incluir elementos de interfaz de usuario comunes como el encabezado de la aplicación, navegación o elementos de menú, y el pie de página. Las estructuras HTML comunes, como scripts y hojas de estilo, también se usan con frecuencia en muchas páginas dentro de una aplicación. Todos estos elementos compartidos se pueden definir en un archivo de diseño, al que después se puede hacer referencia mediante cualquiera de las vistas que se usan dentro de la aplicación. Los diseños reducen el código duplicado en las vistas.

• Vista parcial: una vista parcial es un archivo de marcado de Razor (.cshtml) que representa la salida HTML dentro de la salida representada de otro archivo de marcado. Las vistas parciales se usan para dividir archivos de marcado de gran tamaño en componentes más pequeños. También reducen la duplicación de contenido de marcado común entre archivos de marcado. Las vistas parciales no se usan para mantener elementos de diseño comunes. Los elementos de diseño comunes se especifican en un archivo _Layout.cshtml.

Los diseños y las vistas parciales se encuentran fuera del ámbito de este módulo. Al final del módulo, se proporcionan vínculos para profundizar más en las características y los conceptos que se han presentado aquí.

La estructura de directorios Pages y las solicitudes de enrutamiento de páginas

Razor Pages usa la estructura de directorios dentro del directorio Pages como convención para el enrutamiento de las solicitudes de manera predeterminada. Una página de índice ubicada en la raíz del directorio Pages, por ejemplo, es la página predeterminada del sitio de la aplicación. En el directorio Pages/Products del proyecto RazorPagesPizza, encontrará una colección de páginas de Razor, incluida una página Index.cshtml. Por ejemplo, las solicitudes enrutadas a /Product/ se dirigirán para usar la página Index.cshtml predeterminada ubicada físicamente en Products/Index.cshtml. Las páginas de Razor del proyecto (.cshtml) y las clases PageModel que las acompañan (.cshtml.cs) se agrupan de manera conveniente en Pages/Products. Los valores de parámetro de ruta que se han pasado son accesibles a través de una propiedad. ASP.NET Core ofrece características de enrutamiento sólidas.

En la tabla siguiente se proporcionan las rutas que se van a usar en el proyecto completado de este módulo.

Comprobar los conocimientos