Crear nuestro primer proyecto Blazor - Tutorial de Blazor

Vamos a crear nuestro primer proyecto Blazor. Para ello, vamos a hacer uso de las plantillas que tenemos disponibles al haber instalado Visual Studio 2019 con la carga de trabajo de ASP.NET Web. Para crear nuestro proyecto, podemos hacerlo de dos formas. La primera sería utilizando la interfaz gráfica de Visual Studio y la segunda podría ser utilizando la interfaz de línea de comandos dotnet. dotnet es una herramienta que nos permite desde la consola crear proyectos, compilarlos, hacer test, crear soluciones, añadir proyectos, un montón de cosas. Como a mí me gusta la consola porque suele ser bastante accesible, ya que se basa en texto, vamos a empezar creando nuestro proyecto utilizando la herramienta de consola dotnet. Aquí estamos en proyectos, estamos en c:\proyectos, vamos aquí a crear una carpeta para nuestro primer proyecto Blazor. md FirstBlazorProject. Estamos aquí. Y ahora vamos a crear el proyecto utilizando dotnet. dotnet new, ahora el nombre de la plantilla, en este caso, la plantilla se llama «blazorwasm», que es el acrónimo que se utiliza para WebAssembly, y aquí con el flag -n, vamos a decirle cómo se tiene que llamar nuestro proyecto. FirstBlazorProject. Fíjate qué rápido lo hace. Listo, ya lo tienes. Ahora vamos a crear una solución para que contenga nuestro proyecto. ¿Cómo lo hacemos? Pues otra vez con dotnet new, pero en este caso le decimos que es sln, que es la plantilla de solución. ¿Y qué nombre le ponemos? Pues FirstBlazorProject. Ya está creada, pero ahora la solución está vacía. ¿Cómo añadimos el proyecto? dotnet sln, que es el subcomando para manejar soluciones, add, y aquí le damos la ruta del csproj. FirstBlazorProject \FirstBlazorProject.csproj. No hace falta decirle dónde está la solución, ya que la herramienta automáticamente busca la solución dentro del directorio actual. Bien, pues ahora que ya tenemos la solución creada, vamos a abrirla desde Visual Studio para que veas que el proyecto está creado perfectamente. Visual Studio 2019. Abrimos la solución, FirstBlazorProject y aquí lo tenemos. Fíjate que tenemos la solución, y dentro, el proyecto con toda su estructura. Podríamos compilarlo, Shift F6. Como ves, yo utilizo muchísimo las teclas rápidas ya que no puedo utilizar el ratón. Ya se ha compilado sin ningún tipo de error. Ahora vamos a cerrar Visual Studio y vamos a hacer el mismo proyecto pero utilizando su interfaz gráfica. Vamos a la carpeta de los proyectos y borramos la carpeta FirstBlazorProject. Le decimos que sí. Ya lo tenemos borrado. Ahora vamos a Visual Studio y vamos a crear nuestro proyecto utilizando la misma plantilla que antes, pero desde la interfaz gráfica. Proyecto nuevo. Le decimos que el tipo va a ser Blazor App, perfecto. ¿Cómo se va a llamar? Pues igual que el otro. Como hemos borrado, la carpeta no importa. FirstBlazorProject. Location está bien, el nombre de la solución también y pulsamos en Crear. Ahora aquí tenemos que decirle qué plataforma queremos, en este caso .NET 5, que está bien puesta. Y el tipo va a ser Blazor WebAssembly. Más adelante veremos la diferencia entre Blazor Server y Blazor WebAssembly. Esto lo dejamos tal cual. Esta casilla la dejamos desmarcada porque queremos que nuestro proyecto sea totalmente estático, también veremos más adelante la diferencia entre hacerlo con ASP.NET hosted o no, y tampoco queremos una progressive application, por lo cual también dejamos esto desmarcado. Pulsamos en Create, y como ves, tenemos exactamente el mismo proyecto que anteriormente creamos utilizando la plantilla pero desde la línea de comandos.