¿Qué es Radzen?

Hola a todos de nuevo, compensación con dos entradas después de haber tenido mis lares de programación llenitos de polvo, así que esta vez os explicaré lo que es el Radzen.

Radzen explicado con mis palabras podría decir que son ciertos elementos como podría ser por ejemplo una tabla, un desplegable, un calendario y muchísimos elementos que solemos incluir en nuestras aplicaciones, previamente desarrollados, con su propio código ya a mano para que nosotros podamos incluirlo en nuestra aplicación, en cuanto a los estilos, si queremos por ejemplo cambiarle el color o cierto aspectos de dichos elementos dejadme deciros que Blazor ya incluye en algunas clases de sus proyectos su propio CSS y ahí es donde podréis personalizarlo a vuestro gusto.

Bien, una vez explicado lo que es el Radzen, ¿qué debemos hacer para incluirlo en nuestro proyecto de Blazor? Los pasos son bastante sencillos, eso sí, hay que tener en cuenta que dependiendo del tipo de Blazor que sea (Blazor Server o Blazor WebAssembly) cambiará un poco, esto si mal no recuerdo, los tipos de blazor existentes, los expliqué en una entrada aparte hace meses atrás.

Pero bueno, lo primero que tenéis que hacer es adentraros en esta página: https://blazor.radzen.com/get-started

En esa página explica los pasos pero como yo soy buena gente os lo explicaré yo pasito a pasito:

1) El primer paso importante es instalar el paquete nugget correspondiente, porque es obvio que si no instalas dicho paquete vuestro IDE no será capaz de reconocer las etiquetas de los elementos Radzen (RadzenDatagrid, Dropdown) para los que estáis familiarizados con el lenguaje .NET sabréis que un Datagrid y un Dropdown son básicamente una tabla y un desplegable. Debéis poner este comando para instalarlo:

dotnet add package Radzen.Blazor

2) En vuestro _imports.razor debéis incluir los siguientes using's: @using Radzen y @using Radzen.Blazor

3) En Pages/_Layout.cshtml (Si estáis usando Blazor Server con .NET6), Pages/_Host.cshtml (Si usáis Blazor Server con .NET) o www.root/index.html (Si usáis Blazor WebAssembly) habría que incluir lo siguiente:

<link rel="stylesheet" href="_content/Radzen.Blazor/css/material-base.css">

Y esto también: 

<link rel="stylesheet" href="_content/Radzen.Blazor/css/standard-base.css">

4) En Pages/_Layout.cshtml o www.root/index.html incluir el siguiente script:

<script src="_content/Radzen.Blazor/Radzen.Blazor.js"></script>

5) A partir de este punto ya podríamos usar con nuestra total libertad los elementos de Radzen y Blazor los identificaría al instante, así que si por ejemplo queremos incluir una tabla este sería el código:

He subrayado lo que suele ser lo más importante a la hora de poder filtrar vuestros datos, cada etiqueta Radzen tiene tropecientas propiedades que me sería interminable explicaros en una sola entrada pero para más información podéis buscar información en la página de Radzen > Componentes de Blazor, suelen explicar varios detalles, pero si tenéis alguna duda o queréis preguntarme algo en especial ya sabéis lo que tenéis que hacer~.

Podemos dar por finalizada esta entrada, ¿qué os ha parecido el Radzen?