Micro Frontends

Los Micro Frontends son un bloque de construcción fundamental, que mapea las experiencias de los usuarios.

Ver el video Solicita una Demo
Micro Frontends
Micro Frontends

¿Qué son los Micro Frontends?

Los Micro Frontends son un bloque de construcción fundamental, que mapea las experiencias de los usuarios del frontend, empaquetando HTML, CSS y Javascript dentro del scope determinado de una experiencia de frontend para ser conectado a una o más APIs. El propósito es eliminar las dependencias entre equipos que ralentizan el desarrollo y aumentan la complejidad de la gestión de productos digitales al utilizar una arquitectura de una sola página. En otras palabras, los Micro Frontends son la extensión del concepto de microservicio al mundo del frontend.

Lea más en nuestro Blog.

¿Por qué Micro Frontends?

Framework y Tecnología Agnóstica para la Cadencia en Curso

Los Micro Frontends deben tener un Framework agnóstico, para que los equipos puedan beneficiarse de la innovación en curso sin tener que encerrar el desarrollo completo del producto digital en un solo Framework como React, Angular o Vue. Esto entrega mayor flexibilidad a los equipos de desarrollo para hacer su trabajo. Por ejemplo, dos Micro Frontends diferentes pueden tener versiones distintas del mismo Framework en una sola aplicación o pueden desarrollarse completamente en marcos diferentes según la preferencia del equipo y la evolución del Framework.

Convenciones establecidas de gobierno, alcance y denominación

Los Micro Frontends deben tener un grado de gobierno y convenciones que faciliten para los diseñadores y desarrolladores el intercambio entre los diferentes equipos. Aunque la tecnología pueda cambiar, debería existir una arquitectura conceptual. Los Micro Frontends se desarrollan de la misma manera que una aplicación normal de una sola página (SPA), la única diferencia es el alcance del desarrollo. Mientras que una SPA normal contiene definiciones para toda la Aplicación Web, el Micro Frontend sólo se centra en una experiencia simple, tratando de resolver un solo problema. La composición de los Micro Frontends en una capa de alto nivel es lo que hace que todas estas micro experiencias se unan para dar forma al producto digital final.

Bases de código desacopladas para eliminar las dependencias

Los Micro Frontends deben ser fáciles de mantener y comprender a lo largo del tiempo, tener la cantidad adecuada de código desacoplado y ser modificables en cortos períodos de tiempo.

Dominios y sub-dominios de negocio para desarrollar activos de software mantenibles

Los Micro Frontends deben tener un enfoque definido por los dominios y subdominios de negocio que pueden alimentar la base de activos de software de la empresa. Esta base de activos puede ser usada para desplegar el valor del negocio más rápido con Micro Frontends preconstruidos que pueden ser itegrados.

Despliegues independientes para la cadencia de desarrollo sostenido

Los Micro Frontends deberían tener sus propios pipelines, con equipos trabajando de forma independiente en el lanzamiento de nuevas funcionalidades y con una cadencia más predecible que responde a la necesidades de la empresa. Esto permite no tener que volver a desplegar toda la aplicación web cada vez, reduciendo los riesgos y aumentando la velocidad de desarrollo.

Medible para entender la contribución de cada Micro Frontend

Los Micro Frontends deben tener acciones comerciales fáciles de medir, para mejorar el valor comercial derivado de enviar funcionalidades a producción más rápido. Por ejemplo, cuando se construyen Micro Frontends para un banco debemos tener acciones comerciales bien definidas, que nos permitan medir el rendimiento del Micro Frontend desde diferentes puntos de vista. Tanto comerciales como técnicos. Al cambiar de un Micro Frontend a otro, ¿Incrementamos el comportamiento deseado del cliente?

Modyo potencia los Micro Frontends

Modyo permite que los desarrolladores trabajen en Micro Frontends utilizando el concepto de Widgets. Estos son bloques de construcción para productos digitales, construidos utilizando la Plataforma Modyo. Los desarrolladores pueden empezar desde una de las plantillas de nuestro Catálogo de Widgets, modificar el código y luego conectar el Micro Frontend a Modyo usando la Interfaz de Línea de Comandos de Modyo (CLI). Para los escenarios con pocos desarrolladores y velocidad acelerada, Modyo viene con un Constructor de Widgets que permite a los desarrolladores construir, publicar y mantener Widgets directamente desde el navegador - consola web de Modyo.

Modyo también proporciona un endpoint de API para recoger y analizar acciones comerciales generadas a partir de Widgets y Microservicios para así crear y actualizar segmentos de usuarios, llamados Targets, que permiten la creación de experiencias digitales personalizadas. Modyo participa en el proceso de inicio de sesión del usuario a través de nuestra integración SSO para que sea fácil entender el "quién hizo qué" de las acciones de comerciales.

Micro Frontend Platform

El Framework de Micro Frontends de Modyo

Crear un Micro Frontend

Nuestro Widget Builder permite crear rápidamente Micro Frontends directamente desde cualquier navegador. Las versiones del código se guardan mientras trabajas para que siempre puedas reiniciar o retroceder a los Micro Frontends anteriores.

CLI para Micro Frontends

Trabaja offline y usa tus propios pipelines de desarrollo para luego conectar Micro Frontends directamente a nuestra plataforma. Obtén lo mejor de ambos mundos dependiendo del tamaño de tus equipos y la configuración de la fábrica digital.

Micro Frontend CLI

Micro Frontend Code Review

Cuando se construyen Micro Frontends en el Widget Builder de Modyo, cada cambio se graba para que puedas fácilmente retroceder o reiniciar un Micro Frontend. Es posible ver los cambios realizados por el equipo al desarrollar desde el navegador.

Team Review

Configura fácilmente las personas necesarias para revisar y publicar los Micro Frontends en producción en los canales digitales. Selecciona las personas y las reglas que quieras aplicar a tus equipos digitales en minutos.

Recursos para aprender sobre Micro Frontends

¿Interesado?

Conversemos sobre cómo podemos ayudarte a acelerar tu transformación digital con Micro Frontends.

Me interesa Lets Go