CloudAPPi Technology Web
Razor Pages

Razor pages es la propuesta de ASP.NET Core MVC para facilitar la creación de contenido web de una forma más cercana al mundo transversal Back, permitiendo programar parte de la lógica en C# y el aspecto de vistas con html, css, js y notaciones propias. 

Introducción a Razor Pages

Una característica que lo hace muy llamativo es la del poder unificar la apificación de los controladores con el apartado web. En este post, vamos a hacer un ejemplo sencillo con el IDE Visual Studio 2019.

Con el IDE ejecutándose, en su pestaña inicial, hacemos clic en “Crear un proyecto” y posteriormente en Aplicación web ASP .NET CORE

Elegimos un nombre para nuestra aplicación y directorio, yo por ejemplo puse “WebApplicationPrueba” y pulsamos en Crear.

El editor nos permite elegir entre algunas plantillas, para empezar es lo más cómodo, pero si ya sois expertos podéis empezar por un proyecto Vacío. En mi caso elijo Aplicación Web, que viene con dos vistas. Elegimos la última versión de .Net Core, y una configuración como la que aparece a continuación.

Nuestro nuevo proyecto tendrá una estructura similar a esta.

Según la documentación oficial, el resumen de los elementos los podéis ver aquí

¿Quieres saber más?

Carpeta Page

Contiene páginas de Razor y archivos auxiliares. Cada página de Razor consta de un par de archivos:

  • Un archivo .cshtml que contiene marcado HTML con código de C# que usa sintaxis de Razor.

  • Archivo . cshtml.cs que contiene C# código que controla los eventos de página.

Los archivos auxiliares tienen nombres que comienzan con un carácter de subrayado. Por ejemplo, el archivo _Layout.cshtml configura los elementos de la interfaz de usuario comunes a todas las páginas. Este archivo configura el menú de navegación de la parte superior de la página y el aviso de copyright de la parte inferior de la página. Para obtener más información, vea Diseño en ASP.NET Core.

Carpeta wwwroot

Contiene los archivos estáticos, como los archivos HTML, los archivos de JavaScript y los archivos CSS. Para obtener más información, vea Archivos estáticos en ASP.NET Core.

appSettings.json

Contiene los datos de configuración, como las cadenas de conexión. Para obtener más información, vea Configuración en ASP.NET Core.

Program.cs

Contiene el punto de entrada del programa. Para obtener más información, vea Host genérico de .NET.

Startup.cs

Contiene código que configura el comportamiento de la aplicación. Para obtener más información, vea Inicio de la aplicación en ASP.NET Core.

¿Cómo ejecutar Razor Pages para probarlo?

Si probamos a ejecutar pulsando el play (botón triángulo verde), se nos abrirá el navegador, y veremos las páginas de prueba que acabamos de generar.

La página inicial, correspondiente al fichero Index.cshtml y privacy correspondiente al fichero Privacy.cshtml

Si indagamos en el código de esta vista index, por ejemplo, podemos ver por un lado el código html que renderiza el contenido, y por otro lado la lógica en C# que hace la página. La estructura básica de cada página será parecida y dependerá de nuestro arte en la Maquetación para darle un buen diseño.
// ¿Quieres saber más sobre Razor Pages?

¡Habla con nuestros expertos!

Author

Sandra Ciruelos

Leave a comment

Tu dirección de correo electrónico no será publicada.