App Builder lanzamiento: Cuadrículas jerárquicas de carga bajo demanda, integración de DevOps, validación de entradas y más.

La última actualización de App Builder, lanzada en mayo, ofrece nuevas y potentes funciones diseñadas para simplificar el desarrollo, mejorar el rendimiento y dar a los desarrolladores y diseñadores más control sobre el comportamiento de las aplicaciones y la experiencia del usuario. Desde la carga de datos más inteligente en cuadrículas jerárquicas hasta la integración nativa de Azure DevOps y las reglas de validación avanzadas en todos los componentes, esta versión está repleta de capacidades que mejoran la productividad.

Antes de sumergirte en estas nuevas funcionalidades, si es la primera vez que aprendes sobre App Builder, permíteme compartir rápidamente por qué deberías considerarlo una herramienta clave en el proceso de desarrollo de aplicaciones para tu organización:

• Un creador de aplicaciones visuales: la plataforma unificada para ejecutivos de nivel C, arquitectos empresariales, líderes de equipos de desarrollo, diseñadores, desarrolladores y partes interesadas.
• Herramienta de arrastrar y soltar WYSIWYG basada en la nube que ayuda a las empresas a diseñar y crear aplicaciones comerciales completas un 80 % más rápido que nunca.
• Una herramienta low-code genera código listo para producción para Angular, React, Web Components y Blazor, y convierte Figma diseños en código.

¿Qué hay de nuevo en esta versión App Builder?

Cuadrícula jerárquica con carga bajo demanda

Ahora puede configurar la carga bajo demanda en la cuadrícula jerárquica a través de RowIslands, lo que permite que los datos secundarios se carguen solo cuando sea necesario. Esto hace que trabajar con grandes conjuntos de datos anidados sea significativamente más rápido y eficiente.

Aspectos destacados clave:

• Genera automáticamente RowIslands anidadas (hasta 5 niveles) cuando se enlazan a datos jerárquicos.
• Cada RowIsland se puede configurar individualmente: admite filtrado, ordenación, paginación y edición.
• Los datos secundarios solo se cargan cuando se expande la fila principal, mediante solicitudes de datos independientes.
• La jerarquía visual aparece en el panel Esquema, lo que ayuda a una navegación y un diseño intuitivos.

Ejemplo de caso de uso:

Defina orígenes de datos independientes para Customers, Orders y OrderDetails. La cuadrícula carga solo lo necesario cuando se expande una fila, lo que da como resultado una experiencia de interfaz de usuario más rápida y limpia.

Hay algunas limitaciones conocidas que se deben tener en cuenta: > copiar y pegar entre niveles secundarios está deshabilitado, no se admite la reordenación, solo se permite el reordenamiento dentro del mismo elemento primario y CRUD, el enlace de datos remoto y las operaciones en cuadrículas secundarias forman parte de la hoja de ruta para futuras versiones.

Integración de Azure DevOps

Ahora puede conectarse App Builder directamente a Azure DevOps, lo que permite canalizaciones de CI/CD y transferencias de código sin problemas con solo unos clics. Lee los documentos de ayuda completos sobre el tema.

Lo que puedes hacer:

• Conexión a un proyecto de Azure DevOps existente
• Crear y publicar código fuente (Angular, React, Blazor o Web Components) directamente en un repositorio de DevOps
• Desencadenar compilaciones automáticas de CI
• Enviar cambios de seguimiento a través de solicitudes de incorporación de cambios
• Prepárese para las implementaciones en vivo (próximamente)

Authentication Tip: Only Work or School Microsoft accounts (Azure AD) are supported for authentication. Personal Microsoft accounts (e.g., @outlook.com) are not compatible without converting to a work account or adding them as a guest to your Azure AD tenant.

Validación de entradas para formularios, cuadrículas y entradas

¡La validación acaba de recibir una actualización significativa! App Builder ahora admite reglas de validación de entrada en formularios, componentes de cuadrícula y entradas independientes.

Reglas admitidas:

• min, max (entradas numéricas/de fecha)
• minLength, maxLength
• pattern (por ejemplo, formato de correo electrónico, máscaras de teléfono)
• required

Estas validaciones se aplican:

• Automáticamente al leer desde un esquema de Swagger
• Manualmente a través de definiciones de reglas personalizadas (que invalidan las reglas de esquema)
• Durante varias interacciones de entrada (al desenfocar, enviar, editar, etc.)

Estados de validación segúnel estándar HTML5

Tipo de entrada	min / max	minLength / maxLength	pattern	Notas
Correo electrónico	❌	✅	✅	Usar patrón para formatos personalizados
Buscar	❌	✅	✅	Funciona como texto libre
Teléfono (tel)	❌	✅	✅	Ideal para formatos de números personalizados
Mensaje de texto	❌	✅	✅	Tipo de entrada más flexible
Contraseña	❌	✅	✅	Úselo para las reglas de fuerza
Número	✅	❌	❌	Compatibilidad con patrones de límites HTML5
Fecha	✅	❌	❌	Usos estrictos YYYY-MM-DD

Encabezados de varias columnas y grupos de columnas plegables

Esta versión App Builder presenta encabezados de varias columnas y grupos de columnas contraíbles, lo que le permite crear diseños de cuadrícula más organizados y receptivos.

Características destacadas:

• Agrupe varias columnas en un solo encabezado principal.
• Los grupos contraíbles se pueden expandir/contraer para controlar las columnas visibles.
• Configure la visibilidad, la fijación y el estado (expandido/contraído) a través del Panel de propiedades o el Panel de esquema.
• Respaldado por el igx-column-group componente y las propiedades como collapsible y visibleWhenCollapsed.

Limitaciones técnicas:

• Actualmente solo se admite un nivel de agrupación debido a las limitaciones de la interfaz de usuario de Angular e Ignite con el renderizado recursivo y las actualizaciones de estructura dinámica.
• Anclaje: al anclar una columna secundaria, también se debe anclar su grupo principal.

Capacidades clave:

• Agregue RouterOutlet contenedores en las vistas principal y secundaria.
• Habilite la navegación profunda de 2 niveles (p. ej., Customers → Orders → Order Details).
• Prepárese para hasta 5 niveles de enrutamiento, que se introducirán en una versión futura.
• Ideal para escenarios de detalles maestros, paneles o interfaces de usuario de divulgación progresiva.

Terminando

El lanzamiento de mayo refleja nuestro compromiso continuo de ofrecer experiencias de aplicaciones modernas y escalables en App Builder. Ya sea que esté diseñando cuadrículas de datos complejas, aplicando reglas de validación sólidas o optimizando los flujos de trabajo de DevOps, esta actualización le brinda las herramientas para moverse más rápido y crear mejor.

Pruebe las nuevas funciones hoy mismo en appbuilder.dev

En conclusión, App Builder cambia las reglas del juego en el proceso de desarrollo de aplicaciones. Con su creador visual basado en la nube, capacidades de código bajo y nuevas funciones, es una herramienta imprescindible para cualquier organización. ¡Pruébalo hoy! Si necesita más detalles, le recomendamos que consulte nuestro:

• Canal Discord.
• Discusiones de GitHub.
• Hoja de ruta.

Para experimentar todo lo que hay en las últimas actualizaciones App Builder, visite su portal de clientes y obtenga la última versión. Como de costumbre, siempre estamos emocionados de recibir sus comentarios y escuchar lo que desea agregar o recomendar. Así que, por favor, envíame un correo electrónico a zkolev@appbuilder.dev y hazme saber cómo podemos ayudarte a seguir aportando valor a tus clientes con Infragistics.