Historial de página

Un microfrontend aislado se integra como un componente web normal,

 Se debe hacer uso de la versión aislada del microfrontend, importar su modulo y hacer uso de su tag, propiedades y eventos tal y como esté definido en el api proporcionado.c

Si, para ello debe existir, o se debe crear, un componente web que exponga la aplicación en modo microfrontend

.

El web component debe tener una propiedad que permita configurar al host el tipo de integración que quiere hacer:

• Stand-Alone: El MICROFRONTEND se encarga de renderizar: header, footer, menú y notificaciones de la aplicación embebida
• Integrada: El HOST se encarga de renderizar: header, footer, menú y notificaciones de la aplicación embebida. El microfrontend enviará  a través de eventos definidos en el api, las notificaciones que el host debe visualizar

Para una integración en build-time necesitas en tiempo de construcción integrar, en la aplicación host, el código del microfrontend.

Para ello hay dos opciones:

• Usar un gestor de paquetería de javascript (npm, yarn, pnpm etc) y el fichero package.json para definir y obtener el código del microfontend
• Incorporarlo de forma manual

Para ambas opciones el proceso es similar

• Obtener el código del repositorio de artefactos
• Incorporarlo en el código de la aplicación  (en caso de ser necesario)
• Bundelizarlo.

Para una integración en run-time necesitas que el microfrontend esté publicado en el CDN.

Hay dos mecanismos de integración:

• Script: añades al host los scripts, del entorno adecuado, marcados por la documentación del microfrontend para su integración.
• Importmap: añades al host la definición, del entorno adecuado, de los importmaps marcados por la documentación del microfrontend para su integración.

Todos los microfrontales están desarrollados en base a las directrices marcadas por el sistema de diseño e instanciando para ello el componente de theme de la stic

Hay tres escenarios:

• El host sigue las directrices marcadas por el sistema de diseño e instancia el componente de theme de la stic.
  • El microfrontend quedará automáticamente integrado sin discrepancia visual
• El host NO sigue las directrices marcadas por el sistema de diseño pero si hace uso del componente de theme de la stic.
  • El microfrontend quedará automáticamente integrado sin discrepancia visual
• El host NO sigue las directrices marcadas por el sistema de diseño  y NO hace uso del componente de theme de la stic.
  • El microfrontend quedará integrado CON discrepancia visual ya que implementará el theming por defecto que es el del componente theme de la stic.
  • En estos casos se recomienda integrarlo en una pantalla, dialog o ventana a parte para que el choque visual se minimice