{"id":16035,"date":"2025-07-04T10:06:42","date_gmt":"2025-07-04T08:06:42","guid":{"rendered":"https:\/\/www.hiberus.com\/crecemos-contigo\/?p=16035"},"modified":"2025-07-04T09:16:02","modified_gmt":"2025-07-04T07:16:02","slug":"que-es-blazor","status":"publish","type":"post","link":"https:\/\/www.hiberus.com\/crecemos-contigo\/que-es-blazor\/","title":{"rendered":"Qu\u00e9 es Blazor y c\u00f3mo funciona"},"content":{"rendered":"

De todos es bien conocido que <\/span>el lenguaje de programaci\u00f3n predominante<\/span><\/b> en las aplicaciones web interactivas <\/span>es\u202fJavascript<\/span><\/b>\u202fy, si no, es cualquier framework basado en este. Para los desarrolladores .NET esto ha supuesto siempre una barrera para poder crear aplicaciones modernas y r\u00e1pidas. Los reyes de las aplicaciones web enriquecidas est\u00e1 en manos de los single page applications (SPAs) lo que hace que, de manera forzosa, los equipos .NET deban aprender un lenguaje fuera de su dominio (React, <\/span>Angular<\/span><\/a>, Vue.js, etc.).<\/span>\u00a0<\/span><\/p>\n

Pero \u00bfy si te digo que <\/span>existe un framework capaz de alcanzar toda la potencia de un SPA<\/span><\/b> moderno, pero sin entrar en contacto con c\u00f3digo Javascript, s\u00f3lamente usando C#? Como habr\u00e1s intuido, esto es lo que nos va a ofrecer\u202f<\/span>Blazor<\/span><\/b>.<\/span>\u00a0<\/span><\/p>\n

\"\"<\/p>\n

\u00bfQu\u00e9 es Blazor?<\/h2>\n

Blazor\u202fes un proyecto desarrollado por Microsoft creado para permitir\u202f<\/span>crear SPAs \u00fanicamente usando lenguajes de programaci\u00f3n C# y Razor Pages<\/span><\/b>, eliminando la necesidad de programar en Javascript o en frameworks derivados.<\/span>\u00a0<\/span><\/p>\n

El objetivo de Microsoft est\u00e1 claro: entrar de manera directa en el mundo de los SPA a trav\u00e9s de Blazor, teniendo una\u202f<\/span>curva de aprendizaje plana<\/span><\/b>\u202fpara los desarrolladores .NET, abstrayendo la complejidad que requiere el tener que trabajar con frameworks Javascript. En consecuencia, se construir\u00e1n aplicaciones web enriquecidas usando \u00fanicamente HTML, CSS y C# en lugar de Javascript.<\/span>\u00a0<\/span><\/p>\n

Vamos a ver los diferentes modelos de hospedaje que ofrece Blazor a continuaci\u00f3n<\/span><\/p>\n

Modelos de hospedaje de Blazor<\/h2>\n

Blazor presenta dos enfoques claramente diferenciados: Blazor Server y Blazor WebAssembly<\/strong>.\u00a0<\/span>\u00a0<\/span><\/p>\n

Por un lado, <\/span>Blazor Server se construye el DOM<\/span><\/b> que se ha de enviar al cliente desde el servidor. Es el modelo m\u00e1s tradicional, cuyo objetivo es sustituir el modelo Web Forms de .NET. <\/span>Su principal fuerte es la\u202finteracci\u00f3n en tiempo real<\/span><\/b>\u202fentre cliente y servidor a trav\u00e9s de\u202fSignalR.<\/span>\u00a0<\/span><\/p>\n

Por otro lado, <\/span>Blazor WebAssembly es un modelo SPA basado en WebAssembly<\/span><\/b>,\u202f<\/span><\/i>es decir,<\/span>\u202fla construcci\u00f3n del DOM se realizar\u00e1 en el lado del cliente<\/span><\/b>. Permite,\u202fa su vez, realizar operaciones en el lado del servidor, llamando a APIs para solicitar datos, con la intencionalidad de obtener informaci\u00f3n sensible que no se quiera calcular en el cliente.\u00a0<\/span>\u00a0<\/span><\/p>\n

\"Blazor<\/p>\n

WebAssembly\u202f<\/span><\/b>(conocido tambi\u00e9n por su abreviatura\u202fWasm)<\/span> es un est\u00e1ndar que permite\u202fejecutar c\u00f3digo binario en un navegador web<\/span><\/b>\u202fpara ofrecer un rendimiento a priori mayor que Javascript.<\/span>\u00a0<\/span><\/p>\n

El servidor web se encargar\u00e1 de enviar al navegador cliente que realice una petici\u00f3n a nuestra aplicaci\u00f3n las librer\u00edas directamente compiladas (dlls), y el navegador a trav\u00e9s de esta tecnolog\u00eda sabr\u00e1 interpretar lo que queremos ejecutar. Como consecuencia,\u202f<\/span>el servidor web se liberar\u00e1 de procesar l\u00f3gica<\/span><\/b>, ya que se realizar\u00e1 en el cliente.<\/span>\u00a0<\/span><\/p>\n

Con esta aproximaci\u00f3n, <\/span>se sobreentiende la necesidad de mantener un back-end<\/span><\/b> con el procesamiento de informaci\u00f3n que no se quiera llevar al cliente. Recordemos que las librer\u00edas compiladas son f\u00e1cilmente decompilables, exponiendo nuestro c\u00f3digo fuente a cualquier usuario de nuestra aplicaci\u00f3n.<\/span>\u00a0<\/span><\/p>\n

JS Interop<\/h3>\n

\u00bfY esto quiere decir que ya no podemos usar Javascript? Nada m\u00e1s lejos de la realidad. Existen multitud de librer\u00edas de terceros ya escritas en Javascript, que podemos seguir utilizando tambi\u00e9n en Blazor. Para ello, se ofrece la posibilidad de hacer trabajar de manera conjunta a Javascript y C# a trav\u00e9s del servicio\u202fIJSRuntime.<\/span>\u00a0<\/span><\/p>\n

Esto quiere decir que, sin salirnos del marco .NET,\u202f<\/span>se podr\u00e1n realizar peticiones a funciones escritas en Javascript<\/span><\/b>, pasando los datos que se requieran a dichas funciones.<\/span>\u00a0<\/span><\/p>\n

C\u00f3mo usar Blazor: ejemplo real<\/h2>\n

Y una vez entendidos los conceptos, vamos a ver un ejemplo de uso real en el que Blazor puede ser una soluci\u00f3n m\u00e1s que v\u00e1lida. Vamos a plantear una aplicaci\u00f3n web de preguntas y respuestas. Para ello, vamos a necesitar:<\/span>\u00a0<\/span><\/p>\n