Autor en Google+
Saltar al contenido

Artículos, tutoriales, trucos, curiosidades, reflexiones y links sobre programación web ASP.NET Core, MVC, Blazor, SignalR, Entity Framework, C#, Azure, Javascript... y lo que venga ;)

14 años online

el blog de José M. Aguilar

Inicio El autor Contactar

Artículos, tutoriales, trucos, curiosidades, reflexiones y links sobre programación web
ASP.NET Core, MVC, Blazor, SignalR, Entity Framework, C#, Azure, Javascript...

¡Microsoft MVP!
martes, 15 de septiembre de 2020
Blazor

¡Os traigo buenas noticias! Me complace anunciaros que por fin está disponible en el catálogo de CampusMVP el curso en el que he estado trabajando intensamente durante varios meses, y que me consta que muchos estabais esperando: Desarrollo de aplicaciones Web con Blazor.

Su creación ha sido bastante laboriosa porque queríamos ofreceros el mejor y más completo curso sobre Blazor que podéis encontrar en este momento, y no es fácil conseguirlo cuando se trata de una tecnología tan reciente, de la que aún no existe tanta documentación, bibliografía y ejemplos como las hay de otras tecnologías con más años de recorrido. Ha sido duro, pero tanto un servidor como el equipo de producción de CampusMVP que ha participado en su creación, estamos orgullosos del resultado y firmemente convencidos de que lo que hemos logrado: un recorrido práctico, minucioso y profundo del que es, sin duda es el framework que cambiará vuestra forma de desarrollar aplicaciones para la web.

En este post vamos a intentar resolver las siguientes cuestiones:

¿Qué es Blazor?

Para los que todavía estéis algo despistados, Blazor es un novedoso framework para la web que parte de un ambicioso objetivo: permitir a los desarrolladores .NET construir aplicaciones web SPA, al estilo de Angular, React o Vue, pero utilizando únicamente C# en lugar de Javascript. Es decir, a diferencia de las soluciones tradicionales para crear aplicaciones web SPA:

  • Utilizaremos los entornos de desarrollo con los que nos sentimos cómodos los desarrolladores .NET, como Visual Studio, para crear, programar, depurar, testear y distribuir nuestras aplicaciones.
  • O, como ocurre en toda la nueva generación de tecnologías del ecosistema .NET, podremos desarrollar y ejecutar sobre cualquier sistema operativo y usar herramientas más ligeras como Visual Studio Code o la línea de comandos de .NET.
  • Utilizaremos C# en lugar de JavaScript para implementar la capa de presentación, algo que hasta ahora no era posible conseguir, con las ventajas que ello conlleva.
  • Aprovecharemos los conocimientos que ya tenemos de .NET para crear aplicaciones web SPA. Es decir, podremos usar los tipos y clases de .NET con las que llevamos años trabajando, pero para crear aplicaciones que corren en el navegador.
  • Será posible reutilizar código existente en todas las capas de las aplicaciones, así como compartir código entre cliente y servidor, pues ambos utilizarán las mismas tecnologías.

Seguro que alguno pensará que todo esto lo ha escuchado antes, pero el protagonista era Silverlight. Nada más lejos de eso; no estamos hablando de "incrustar" código .NET en un browser usando tecnologías propietarias como hacíamos años atrás, en la era RIA (Rich Internet Applications), sino en una tecnología respetuosa y alineada con estándares abiertos de la web.

Puedes leer algo más sobre Blazor en los siguientes artículos:

¿Me interesa aprender a desarrollar con Blazor?

Si trabajas en la creación de aplicaciones web con tecnologías Microsoft, la respuesta es categórica: sin duda, deberías aprender Blazor. Deja que te explique por qué.

La imparable popularización de las aplicaciones web SPA ha traído de la mano algunos problemas para los desarrolladores .NET. Incluso los frameworks más modernos y potentes, como ASP.NET Core MVC o Web API, no ofrecen herramientas para la creación de aplicaciones SPA, por lo que nos vemos obligados a:

  • Quedar relegados al desarrollo del backend del que normalmente hacen uso de este tipo de sistemas.
  • Movernos al frontend, aprendiendo a trabajar con frameworks como Angular, React, Vue o cualquiera de los muchos otros disponibles en el ecosistema Javascript.

Si, como es bastante habitual, eres de los que tienen que tocar un poco de todo (aka full-stack developer) probablemente habrás sufrido al elegir esta última opción. Para los desarrolladores .NET, los frameworks de frontend suelen ser un territorio hostil e incómodo porque:

  • No es sencillo elegir en cuál de las cestas poner los huevos. Aunque últimamente parece haberse relajado algo la cosa, durante años, el mundillo de los frameworks SPA ha vivido constantes terremotos y no era sencillo decantarse por una u otra opción.
  • Debemos utilizar herramientas distintas a las habituales, y veces no se llevan demasiado bien entre ellas, por lo que nos vemos obligados a usar distintos "cinturones de herramientas" en función de lo que vayamos a hacer en cada momento.
  • Todo esto obliga a aprender un modelo de programación completamente nuevo: sintaxis, workflows de trabajo distintos, bibliotecas de clases y componentes totalmente diferentes, herramientas diversas (y a veces poco amigables), etc.
  • Por no hablar del lenguaje... aunque tiene sus cosas buenas, la experiencia de programación con Javascript queda muy lejos de lo que supone utilizar C#, un lenguaje moderno, potente y con un sistema de tipos estricto que nos defienda de nosotros mismos y nuestros constantes errores. (Es cierto que TypeScript ha suavizado algo este asunto, pero, aún así, la experiencia no está a la altura.)

Con Blazor podremos desarrollar aplicaciones web SPA profesionales, solventando todos los problemas anteriores de un plumazo:

  • La experiencia desde Visual Studio es exactamente como la conoces: compilación, ejecución, depuración, testing, etc. Todo lo harás usando las mismas herramientas de siempre, con las que ya eres productivo.
  • ... aunque, si lo prefieres, podrás programar utilizando Visual Studio Code o cualquier otro editor ligero al que estés acostumbrado y usar la línea de comandos para compilar, ejecutar, testear o distribuir.
  • En lugar de JavaScript, programarás la lógica de la interfaz de usuario en C#, y utilizarás la biblioteca de clases de .NET que ya conoces de sobra.
  • Lo anterior ya hace que la curva de aprendizaje sea suave, pero, aún hay más:
    • Si conoces Razor de ASP.NET MVC, ASP.NET Core o Razor Pages, ya conoces la sintaxis usada principalmente en Blazor.
    • También encontrarás que una de las modalidades de Blazor, Blazor Server, es conceptualmente similar a ASP.NET Web Forms (aunque por supuesto sin sus conocidos problemas), por lo que no te costará mucho trabajo entenderlo si partes desde ese punto.

Obviamente tendrás que aprender a trabajar con Blazor, pero al menos no deberás dedicar tiempo a conocer a fondo el entorno, las herramientas, las bibliotecas base o el lenguaje para sacarle partido: esa lección ya la traes aprendida de casa ;)

Pero no sólo eso. Una vez conoces Blazor te das cuenta de que está construido sobre elementos muy sencillos, pensados disparar nuestra productividad desde el minuto uno. Una vez conoces algunos fundamentos básicos, verás que puedes crear componentes, o elementos visuales reutilizables, con una facilidad y velocidad pasmosas.

Con Blazor, los desarrolladores .NET pueden crear espectaculares aplicaciones web SPA sin abandonar las herramientas ni el lenguaje que ya utilizan a diario.

Hace poco aprendí ASP.NET Core, ¿significa la llegada de Blazor que ya no me valen estos conocimientos?

En absoluto. De hecho, si conoces ASP.NET Core estarás mejor posicionado para exprimir Blazor al máximo, porque hay conocimientos que podrás aprovechar directamente.

Por ejemplo, Blazor Server, que es uno de los modelos de hosting utilizados por este marco de trabajo, es una aplicación ASP.NET Core, por lo que hereda de la plataforma muchas funcionalidades de forma directa: startup, inyección de dependencias, logging, settings, middlewares, routing, etc.

En caso de optar por el modelo de ejecución en el lado cliente, denominado Blazor WebAssembly, los conocimientos de ASP.NET Core nos vendrán de perlas para la implementación del backend, imprescindible en cualquier aplicación SPA. Además, en este caso, podrás disfrutar de las ventajas de utilizar .NET en ambos extremos: ¡podrás compartir código C# entre frontend y backend de forma directa!

Blazor no sustituye a MVC ni Razor Pages, simplemente cubre un hueco que anteriormente no estaba resuelto en el stack de tecnologías .NET. Por tanto, no es un reemplazo sino una opción adicional que nos simplificará el acceso al mundo de las aplicaciones SPA.

¿En qué consiste el curso de desarrollo con Blazor?

Este curso se imparte completamente online utilizando la potentísima plataforma de eLearning SELF (de los mismos que están detrás de CampusMVP), y siguiendo su contrastada metodología para asegurar tu éxito a lo largo el proceso de formación.

Curso de Blazor en CampusMVP

Sin horarios y a tu propio ritmo, pero no en solitario: contarás con todo el soporte del equipo de CampusMVP y, dado que soy el tutor, me tendrás a tu disposición para la resolución de dudas y ayudarte durante aprendizaje.

La dedicación estimada ronda las 5 o 6 horas semanales, durante un total de 12 semanas. A lo largo de ellas realizaremos un profundo recorrido en Blazor, partiendo desde cero, a través de las más de 200 lecciones que componen el temario. Éste, además, lo podrás descargar en formato PDF (más de 400 páginas) al finalizar el curso, para que lo tengas como referencia.

Para afianzar los conocimientos, incluimos también varias horas de grabaciones en vídeo, llevadas a cabo de forma magistral por el gran José Manuel Alarcón, donde podrás ver en vivo el funcionamiento de muchas de las características que vamos estudiando.

Pero el curso no sólo consiste en contenido teórico: a lo largo del mismo encontrarás numerosas prácticas que te ayudarán a conseguir una mejor asimilación de los conceptos, así como proyectos descargables, consejos, trucos e ideas que seguro te resultarán de utilidad cuando vayas a aplicar tus nuevos conocimientos.

¿Y cómo saber tu nivel de aprovechamiento? Sencillo. Conforme vayas avanzando te propondremos autoevaluaciones que te permitirán conocer tu grado de conocimiento sobre los contenidos. Al finalizar el curso podrás acreditar su realización mediante un diploma, así como incluirlo en tu perfil certificado de CampusMVP, un perfil online verificable por terceros donde puedes demostrar qué has aprendido con nosotros.

¿Cuáles son los contenidos del curso?

En este curso hacemos un completo recorrido de Blazor, comenzando desde cero.

Tras una breve introducción para ponernos en contexto, inmediatamente comenzamos describiendo los dos modelos de hosting disponibles para el desarrollo web: Blazor Server y Blazor WebAssembly. Veremos cómo funcionan, sus elementos arquitecturales y las ventajas e inconvenientes de cada uno, para que puedas elegir cuál es el que más te conviene en cada caso.

A lo largo del curso estudiaremos Blazor Server y Blazor WebAssembly en paralelo, por lo que al finalizar estarás en disposición de crear aplicaciones utilizando cualquiera de ellos.

Seguidamente, entraremos en faena creando nuestros primeros proyectos Blazor, echando un vistazo a la forma de organizarlos y los tipos de componentes con los que estructuraremos nuestras aplicaciones.

Estudiaremos también en la sintaxis Razor, fundamental a la hora de escribir componentes, detallando sus particularidades y diferencias respecto al Razor que usamos en MVC o Razor Pages, directivas, construcciones y técnicas para organizar y simplificar el código.

Aprenderemos las distintas fórmulas para comunicar componentes, y a sacar provecho de los eventos del ciclo de vida de los mismos, así como a controlar aspectos como la liberación o renderización.

Empezaremos creando componentes simples, pero iremos profundizando sucesivamente hasta llegar a componentes complejos que usan toda la potencia de Blazor para crear elementos altamente reutilizables gracias a la parametrización, uso de fragmentos o tipado genérico. Veremos cómo consumir y producir eventos del sistema o personalizados para facilitar la comunicación bidireccional entre componentes.

Haremos también una parada en la inyección de dependencias y aprenderemos a utilizarla para crear componentes más sencillos, limpios y reutilizables.

Dedicaremos un módulo al sistema de navegación y routing de Blazor, aprendiendo a construir sitios navegables y controlar la navegación del usuario.

También pondremos el foco en el potente sistema de binding, ese mecanismo que enlaza la UI con nuestras clases .NET de forma casi mágica. Seguidamente, nos centraremos en estudiar las herramientas que ofrece Blazor para ayudarnos a crear formularios de datos y validar la información suministrada.

La interoperación con Javascript también toma su protagonismo en el curso. Las fórmulas para comunicar nuestro código Blazor con este lenguaje abre la puerta al aprovechamiento del enorme ecosistema del mismo, consiguiendo que en muchas ocasiones no tengamos que partir de cero a la hora de crear interfaces espectaculares.

Ya casi finalizando, nos detendremos en estudiar los mecanismos de autenticación y autorización que nos permitirán construir aplicaciones seguras y adaptadas a distintos perfiles de usuario. Veremos también cómo crear aplicaciones internacionalizadas, crear y distribuir componentes reutilizables o algunas técnicas para testear nuestros componentes.

De forma trasversal, al final de cada módulo te demostraremos sobre una aplicación real cómo "encajan" los conceptos que hemos ido viendo en él. Esa aplicación es BlazorStore, la plataforma de comercio electrónico que desarrollarás al finalizar el curso, y para la que hemos reservado sus últimas lecciones:

¿Qué conocimientos previos necesito para seguir el curso?

Si estás leyendo esto, probablemente los tengas ;)

En primer lugar, dado que se trata de un curso de programación de aplicaciones web, es necesario que conozcas los fundamentos de este tipo de sistemas, al menos a un nivel básico. Debes saber identificar cliente y servidor, entender las responsabilidades de cada uno de estos extremos y conocer mínimamente los mecanismos de comunicación entre ellos.

También es importante que conozcas algo de HTML y CSS, y muy recomendable que tengas algunas nociones de Javascript, aunque no es indispensable.

Por último, dado que una de las premisas de Blazor es conseguir que desarrolles usando C# y .NET, ¡qué menos que conocerlos! En el curso asumiremos que tienes un nivel razonable de C# y que has trabajado con la biblioteca de clases base de .NET. Es decir, en el curso no explicaremos qué es una expresión lambda o qué es un objeto de tipo List<string>, se supone que debes saberlo antes de comenzar.

Tampoco es necesario conocer nada sobre tecnologías de acceso a datos, pues el curso no entraremos en ello. En algunos ejemplos usaremos Entity Framework Core, pero no es necesario que lo conozcas para poder seguirlos sin problema.

Me convence, ¿cuándo empezamos?

Pues cuando tú quieras :) Sólo tienes que visitar la web de CampusMVP, inscribirte, y casi sobre la marcha te facilitarán las credenciales de acceso a la plataforma.

Recuerda que si trabajas para una empresa española este curso podrías hacerlo prácticamente sin coste, gracias a la Formación Bonificada.

¡Eso es todo! Ahora es vuestro turno...

Bueno, pues creo que con esto quedarán despejadas todas vuestras dudas sobre el curso, o al menos muchas de ellas. Si no es así, no dudéis en contactar con CampusMVP, donde os van a atender de maravilla, o conmigo a través de un comentario, correo electrónico o usando el formulario de contacto del blog.

¡Espero veros a muchos por allí!

Publicado en: www.variablenotfound.com

Estos contenidos se publican bajo una licencia de Creative Commons Licencia Reconocimiento-No comercial-Compartir bajo la misma licencia 3.0 España de Creative Commons

Aún no hay comentarios, ¡sé el primero!

Artículos relacionados: