(+34) 673 566 782 - (+34) 960 653 052 formacion@imaginagroup.com

Aprende ASP.NET Core – Tutorial de Primeros Pasos

ASP.NET Core es un framework multiplataforma de código abierto y de alto rendimiento para crear aplicaciones conectadas a internet, como aplicaciones web y APIs Web.

Fue diseñado para proporcionar un framework de desarrollo optimizado para las aplicaciones que se implementan en la nube o se ejecutan en las instalaciones del cliente.

Utilizando ASP.NET Core puedes hacer lo siguiente, compilar servicios y aplicaciones web, aplicaciones IoT, ejecutar implementaciones locales y en la nube, puede ser ejecutado en .NET Core o en .NET Framework.

Ya tienes disponible el curso de la versión más reciente de ASP.NET Core

¿Por qué utilizar ASP.NET Core?

Muchísimos desarrolladores utilizan ASP.NET Core debido a un cambio en su arquitectura respecto a ASP.NET 4.x dando como resultado un framework más sencillo y modular. Esto se debe a que ASP.NET Core se realizó desde cero, no como una actualización de ASP.NET.

Como toda plataforma de desarrollo moderna es esencial un mecanismo para que los desarrolladores puedan crear, compartir y consumir código útil. ASP.NET Core a diferencia de ASP.NET, utiliza NuGet para distribuir toda esta información.

Un paquete NuGet es una archivo comprimido(por ejemplo ZIP) con la extensión .nupkg que contiene código compilado, otros archivos relacionados con ese código y un manifiesto descriptivo con toda la información del paquete.

NuGet se encarga de definir cómo se crean, hospedan y consumen los paquetes en .NET, y ofrece herramientas para cada uno de esos roles. Gracias a esta forma de empaquetar se reduce el intercambio de información y conseguimos un rendimiento mejorado aumentando así la seguridad de nuestra aplicación.

Principales ventajas

  • Herramientas que simplifican el desarrollo web moderno.
  • Código abierto y centrado en la comunidad.
  • Una plataforma unificada para la creación de interfaz web y las APIs web.
  • Crea y ejecuta aplicaciones multiplataforma ASP.NET Core en windows, Mac y Linux.
  • Capacidad de hospedarse en IIS, Nginx,Apache, Docker o de autohospedarse en su propio proceso.
  • Integración de frameworks del lado del cliente como por ejemplo JavaScriptServices, TypeScript, Bootstrap, Angular.

Modelo Vista Controlador (MVC)

El Modelo-Vista-Controlador separa en tres componentes una aplicación: el modelo, la vista y en controlador.

  • Modelo: se encarga de la implementación de la lógica del dominio de datos de la aplicación.
  • Vista: es el componente encargado de mostrar la interfaz de usuario de la aplicación creado a partir de los datos del modelo.
  • Controlador: controlan la interacción del usuario trabajando con el modelo y seleccionando la vista para representar la interfaz de usuario.

El usuario interactúa con la interfaz de usuario y el controlador recibe la notificación de la acción solicitada por el usuario.

El controlador accede al modelo, actualizando la información.

La vista obtiene los datos del modelo para generar de nuevo la interfaz donde el usuario verá la información actualizada

El modelo MVC ayuda a administrar la complejidad de la aplicación, pudiendo desarrollar en cad momento un único aspecto de la implementación sin afectar a los otros componentes del proyecto.

Debido a que el acoplamiento de las diferentes lógicas son muy vagas favorece el desarrollo en paralelo de los programadores, por ejemplo, un programador puede estar desarrollando tranquilamente los controladores mientras otro programador desarrolla el modelo.
Más adelante en el curso profundizaremos mucho más sobre el Modelo-Vista-Controlador.

Razor

Razor es un lenguaje que utiliza ASP.NET Core desde ASP.NET, que combina el marcado de Razor, C#, HTML y se utiliza para insertar código basado en servidor en páginas web.

El código basado en el servidor permite realizar contenido web dinámico sobre la marcha, mientras la página web se escribe en el navegador. Cuando la página es llamada, el servidor ejecuta el código basado en servidor en la página y después la página es devuelta al navegador. Al ejecutar el servidor, el código puede realizar tareas complejas, como por ejemplo, acceder a la base de datos.

Razor admite C# y usa el símbolo @ para realizar la transición de HTML a C#. Cuando hacemos una transición, Razor evalúa las expresiones escritas en C# y las representa en la salida HTML.

Cuando se usa una palabra clave de Razor después de @ realiza una transición a un marcado específico de Razor, en caso contrario realizará una transición a C# simple.
A lo largo del curso utilizaremos el lenguaje Razor y podremos ver que los archivos que tienen sintaxis Razor suelen tener la extensión de archivo .cshtml.

Middelware

Es un software intermedio, encargado de controlar las solicitudes y las respuestas de una aplicación mediante una encadenación entre sí, se podría decir que es parecido a una tubería. Estos middleware se representan con fragmentos de código y se pueden expresar como un método anónimo.

Estos métodos intermedios, permiten el paso en la canalización de solicitudes, y son responsables de invocar el siguiente componente de la canalización o cortarla en caso de ser necesario.Se podría decir que actúan como filtros.

Aquí podemos observar un ejemplo de canalización de un middleware, el cliente realiza una solicitud y el middleware controla la canalización con la información de la petición y permite el flujo de datos entre dos entes servidor.

Instalación

Comenzaremos instalando el IDE Visual Studio en su última versión. Utilizaremos Visual Studio Community 2017 ya que es la versión gratuita.

Una vez descargado es posible que al abrirlo el sistema operativo nos indique si queremos validar la instalación y confías en el proveedor de ese software, indicaremos que sí. Aparecerá esta ventana y le daremos a continuar.

Se habrá instalado correctamente el instalador de Visual Studio en caso de que aparezca esta ventana.
Le indicaremos instalar a Visual Studio Community 2017.

En el siguiente paso veremos las cargas de trabajo, es un instalador modular dividido por grupos de características necesarias para el lenguaje de programación o la plataforma que se prefiera. En nuestro caso utilizaremos las siguientes:


En el bloque de dispositivos móviles y juegos no seleccionaremos ninguna carga de trabajo.

Indicaremos “Instalar durante la descarga”.

En el instalador aparecerán las barras de progreso para ver cómo va nuestra instalación.

Podemos ver que en el instalador hay un apartado de instalados y ahí se encuentra nuestro IDE. Le damos a “iniciar” para iniciar la aplicación en caso de que anteriormente no le hayamos indicado el inicio automático.

A continuación hay que instalar el SDK de .NET Core 2.1 Se deberá escoger el instalador en función de tu sistema operativo.

En caso de que tu Windows sea de 32 bits se deberá escoger x86 y si es de 64 se escogerá x64.

Si descargamos el archivo y lo abrimos aparecerá esta pantalla. Para continuar la instalación le clicamos a “install”.

Es posible que el sistema operativo te advierta de la instalación del software y deberás confirmar la instalación. Y cerraremos la ventana acabada la instalación.


Para verificar que se ha instalado correctamente el SDK debemos abrir la terminal de comandos(cmd) de nuestro respectivo sistema operativo.
Escribimos este comando dotnet –info y debería mostrarnos la información del SDK.

Hola Mundo

Para empezar abrimos nuestra aplicación de Visual Studio. Aparecerá una ventana como la imagen a continuación.

Para crear un proyecto abrimos “Archivo” en la esquina superior izquierda.
A continuación aparecerá un desplegable, le indicamos “Nuevo” y “Proyecto”.

 

Nos mostrará la siguiente ventana y en el desplegable de Visual C# buscamos “Aplicación web ASP.NET Core”.
Lo llamamos MiWeb e indicamos la ruta donde queremos guardar nuestro proyecto.

Esta ventana aparecerá una vez aceptemos el nuevo proyecto, aquí indicaremos que plantilla queremos que nos genere por defecto la aplicación.
Como podemos apreciar hay dos desplegables arriba, deben ser .NET Core y ASP.NET Core 2.1, después seleccionamos la plantilla “Aplicación web”.

Una vez creado el proyecto podemos apreciar diferentes ventanas, la principal será donde podremos ver y modificar el código.

En la ventana llamada “Explorador de soluciones” que ocupa el espacio superior izquierdo podemos ver la arquitectura de nuestra aplicación. El apartado “Pages” podemos ver un desglose de las páginas que nos ha generado la plantilla.

Seleccionamos “Index.cshtml” y deberá tener este aspecto.

Antes del primer <div> escribimos:

<h1>¡Hola mundo!</h1>

A continuación compilamos nuestro proyecto para que nos detecte si hay un error o se encuentra todo correcto.

Si todo ha ido correctamente aparecerá en la ventana inferior llamada “Salida” lo siguiente.

 

Para iniciar la aplicación en la barra de herramientas superior podemos ver un botón llamado IIS Express, lo presionamos para que inicie la emulación del servidor para ver nuestra página web.

Es posible que nos salga un aviso de seguridad para confiar en el certificado de desarrollo, debemos aceptar la instalación.

Veremos el resultado, como ha cambiado el título de la página

Uso de cookies: Este sitio web utiliza cookies para que usted tenga la mejor experiencia de usuario. Si continúa navegando está dando su consentimiento para la aceptación de las mencionadas cookies y la aceptación de nuestra política de cookies

ACEPTAR
Aviso de cookies