saltar al contenido
3 ejemplos de aplicaciones Blazor que puedes usar de inmediato

3 ejemplos de aplicaciones Blazor que puedes usar de inmediato

Este artículo explora tres aplicaciones de muestra Blazor completamente funcionales que le ayudarán a empezar con facilidad. Agregue algunas personalizaciones y se convertirán en suyas.

5 minutos de lectura

Las aplicaciones de muestra Blazor proporcionan un buen punto de partida al crear un nuevo proyecto Blazor Server/WebAssembly (especialmente por primera vez). Se pueden utilizar en varios escenarios después de ajustarlos y personalizarlos para que se ajusten a sus necesidades específicas. Desde proporcionar ejemplos de código hasta documentación, facilitar la copia de ejemplos en aplicaciones de prueba locales o demostrar algunas de las mejores prácticas Blazor, puede aprender y beneficiarse significativamente de un ejemplo de aplicación Blazor.

Sin embargo, encontrar una buena muestra que coincida con los requisitos o el escenario de su aplicación a veces puede resultar un desafío. Es fácil comenzar y perfeccionar algunos ejemplos de proyectos Blazor porque se mantienen actualizados, de modo que pueda usarlos como base de inmediato. Otros pueden resultarle un poco abrumadores debido a cosas como:

  • Bibliotecas de terceros y demasiadas clases de datos.
  • Requisitos y particularidades arquitectónicas.
  • Aplicaciones de muestra más antiguas que no reflejan las mejores prácticas y patrones más recientes porque el propio Blazor ha experimentado mejoras significativas.

Es por eso que, en este artículo, reunimos 3 ejemplos principales de aplicaciones Blazor que puedes usar de inmediato.

¿Cuándo empezar con un ejemplo de aplicación Blazor?

Aparte de lo obvio (obtener un inicio rápido y una experiencia de aprendizaje práctico en términos de sintaxis, características y otros fundamentos Blazor), el uso de las aplicaciones de muestra Blazor ofrece muchas otras ventajas.

Para creación rápida de prototipos o una prueba de concepto a pequeña escala

Los ejemplos de aplicaciones web Blazor suelen tener una estructura básica que se puede ampliar o modificar para que coincida con los requisitos de su aplicación Blazor. Esto le permite acelerar la creación de prototipos mientras se concentra en implementar funcionalidades únicas más adelante. El uso de una de estas aplicaciones Blazor también ayuda a evaluar y validar aspectos como la viabilidad e idoneidad técnicas y qué tan bien Blazor puede servir a su proyecto. Frente a las partes interesadas, puede mostrar las características y funcionalidades principales que desea implementar.

Obtener información valiosa

Por lo general, las muestras y los ejemplos suelen estar impulsados por las mejores prácticas, patrones arquitectónicos y técnicas de codificación recomendadas. Al examinar estas aplicaciones de muestra, puede obtener información directamente sobre los enfoques estándar de la industria para diseñar y desarrollar una aplicación Blazor.

Para identificar posibles problemas

Una forma de utilizar ejemplos de proyectos Blazor es verlos como un recurso rápido para solucionar problemas y errores comunes. Puede comparar el código, la estructura y la implementación examinando una aplicación de muestra junto con su propia aplicación Blazor. Esta comparación le permitirá ver cómo la aplicación de muestra maneja características o funcionalidades similares y podrá identificar más fácilmente las discrepancias que pueden ser la causa principal.

Nuestras 3 mejores opciones de ejemplos de aplicaciones Blazor listas para usar

Tenga en cuenta que todas las aplicaciones de ejemplo Blazor enumeradas aquí son independientes del marco. Inicialmente se crearon para Blazor, pero puede cambiar a Angular o Web Components y generar código con un solo clic con nuestro App Builder de código bajo.

APLICACIÓN DE GESTIÓN DE INVENTARIO

Lo que ve aquí es un panel de informes para administrar los niveles de inventario y revisar los productos en stock. La aplicación Blazor utiliza navegación lateral personalizada para enrutamiento y gráficos de categorías para informar el rendimiento. Otros componentes Blazor utilizados: Otros componentes utilizados: Avatar, Botón, Tarjeta, Casilla de verificación, Cuadrícula de datos, Menú desplegable, Icono, Grupo de entrada, Lista, Seleccionar.

Consulte la vista previa de la aplicación de gestión de inventario e inspeccione el código.

APLICACIÓN CRM

Este ejemplo representa una aplicación de estilo maestro-detalle para administrar los detalles del cliente inspirada en HubSpot. Incluye vistas receptivas para el Panel de descripción general y detalles del cliente con múltiples pestañas. Otros componentes Blazor utilizados: acordeón, avatar, botón, botón de icono, casilla de verificación, ventana de diálogo, menú desplegable, panel de expansión, cuadrícula de datos, icono, grupo de entrada, lista, barra de navegación, cajón de navegación, selección, diseño de pestañas.

Consulte la vista previa de la aplicación CRM e inspeccione el código.

APLICACIÓN DE COLABORACIÓN EN EQUIPO

Este ejemplo de aplicación Blazor tiene dos módulos principales: un diseño con tareas y una colección de paneles. Ambos utilizan una combinación de listas, tablas y tarjetas que muestran los diferentes tipos de elementos. La navegación principal se realiza mediante un encabezado. Con él podrás elegir proyectos y crear tareas entre otros. También hay un mini cajón de navegación que contiene íconos para cambiar entre los modos descritos anteriormente. De forma predeterminada, la aplicación Team Collaboration viene en modo oscuro. Otros componentes Blazor utilizados: icono, avatar, lista, botón, cuadrícula.

Consulte la vista previa de la aplicación de colaboración en equipo e inspeccione el código.

Un aviso: desmitificando las aplicaciones de muestra Blazor y el código detrás de ellas

Las aplicaciones de muestra anteriores se crearon desde cero utilizando nuestro App Builder WYSIWYG de bajo código y diferentes componentes Blazor de Ignite UI para Blazor. Si bien la herramienta de código bajo proporciona la forma más fácil y rápida de desarrollar aplicaciones, generar código Blazor limpio e inspeccionarlo en tiempo real, la biblioteca Ignite UI ofrece una amplia gama de controles C# prediseñados y más de 60 gráficos de alto rendimiento. para cualquier escenario de aplicación.

Aquí hay algunas cosas rápidas que facilitan la inspección de una aplicación de muestra y el código detrás de ella cuando se utilizan herramientas de código bajo:

  • Hay un entorno de desarrollo visual.
  • Se beneficiará de una experiencia de desarrollo completa de arrastrar y soltar.
  • Hay una caja de herramientas de controles de interfaz de usuario que se pueden reutilizar en todos los ámbitos.
  • La herramienta tiene capacidades de generación de código.
  • Agiliza la creación rápida de prototipos y la iteración.
  • También están disponibles capacidades de integración integradas con sistemas backend, bases de datos y API.

Y un consejo rápido para desarrolladores al final

Es esencial evaluar siempre cuidadosamente la calidad, confiabilidad y extensibilidad de la aplicación de muestra que está usando para su proyecto Blazor. Asegúrese de que cumpla con los requisitos de su proyecto y sus objetivos a largo plazo. También puede aprovechar nuestra biblioteca de componentes Blazor con todas las funciones y obtener los mejores widgets de su clase en su proyecto escalable, especialmente cuando decide crear una aplicación Blazor desde cero.

Solicitar una demostración