Versiones comparadas

Clave

  • Se ha añadido esta línea.
  • Se ha eliminado esta línea.
  • El formato se ha cambiado.

Tabla de contenidos

Diagramas Arquitectónicos

Conceptuales

En esta sección podrá encontrar preguntas sobre diferentes conceptos en el contexto de los microfrontales

UI Expand
titleQue es un microfrontend

Un microfrontend es un componente web que tiene su propia lógica de negocio y se integra de manera transparente en una interfaz de usuario común

Dicho componente está definido por una api que expone para quien necesite integrarlo.

UI Expand
titleQue es un Fragment

Un fragment es un componente web que ofrece una unidad de interfaz de usuario (UI) que representa un componente funcional.

Son los elementos que, cuando se combinan, forman un microfrontend completo.

Cada fragment puede ser desarrollado, probado y desplegado de forma independiente, permitiendo la modularidad en el desarrollo de frontal.

UI Expand
titleQue es una capability

Una capability es una funcionalidad o característica específica y trasversal que pueden estar distribuidos en uno o varios microfrontends/fragments.

UI Expand
titleQue es un Web Component

Un Web Component es una tecnología estándar de la web que permite crear componentes de interfaz de usuario encapsulados y reutilizables que pueden integrarse fácilmente en cualquier aplicación web, independientemente del framework, tecnología o biblioteca de JavaScript utilizada.

Puede actuar como un "fragment" o una parte reutilizable de la interfaz que es completamente independiente y puede ser integrado sin conflicto en la aplicación mayor.

Los componentes desarrollados pueden:

  • No tener lógica de negocio, es decir, un componente general y trasversal cuya lógica es puramente visual y marcada por lo definido por el sistema de diseño (un botón, una tabla genérica, etc). El catálogo ofrecido por el se encuentra en el Storybook de la STIC.
  • Tener lógica de negocio: , es decir, un componente (organismo de negocio) que implementa una lógica de negocio relacionada con el negocio de la aplicación donde se integra (tabla de usuarios, tabla de pacientes etc). En caso de ser reutilizable, entonces consideraríamos ese componente web como un fragment o un microfrontend en función de su granularidad y componibilidad (búsqueda de paciente, botón para generar una incidencia en CGES de forma automática).
UI Expand
titleUn microfrontend puede estar dentro de otro microfrontend

SI.

Explicación:

  • Un microfrontend es un web component y como todo web component puede ser utilizado para componer nuevos componentes.
  • En caso de que un microfrontend forme parte de otro microfrontend, conceptualmente para este nuevo microfrontend, dejará de ser un microfrontend y pasará a ser un fragment.

Desarrollo

En esta sección podrás encontrar preguntas relativas a aspectos de desarrollo

UI Expand
titleQue tecnología se usa para el desarrollo de web component

La tecnología, determinada por el departamento de arquitectura de la stic, para el desarrollo de web component son:

UI Expand
titleSe puede usar para desarrollos nuevos otras tecnologías

No, en nuevos desarrollos no está permitido usar otra tecnología diferente a Lit

Explicación:

  • Para poder mantener la solución simple, compatible y fácilmente integrable en las diferentes aplicaciones del SAS.
  • Es muy ligero y hay una gran empresa como google, dando soporte al framework.
UI Expand
titlePuedo usar una versión diferente a la marcada por normativa

No se aconseja. 

Explicación:

  • Aunque oficialmente entre las versiones actuales (2 y 3) no existen diferencias de calado que puedan generar incompatibilidades o conflictos, no garantizamos el correcto funcionamiento de los recursos ofrecidos por parte de la STIC
  • Tampoco ofrecemos soporte para aquellos desarrollos que no se encuentren en la misma X.Y.Z (mayor.minor.path)
  • Estamos trabajando para ofrecer un mecanismo de actualización del framework dentro de una misma mayor, que reduzca el impacto en los proyectos que hagan uso de dicha tecnología.
UI Expand
titleNecesito un componente que no se encuentra en el catálogo general

En caso de necesitar un nuevo componente que no se encuentra dentro de los desarrollados por el equipo del catálogo de componentes, se debe crear un ticket Jira de decisión técnica (Tarea genera → tipo: decisión → subtipo: técnica) y asignársela al responsable del departamento LUIS MARTINEZ FONTIVEROS

El ticket deberá contener:

  • La explicación de la necesidad funcional
  • El diseño, alineado con las directrices marcadas por el sistema de diseño, por parte del equipo de UX asignado al proyecto
  • Una entrada en la tabla que identifica los componentes utilizados en el proyecto

Una vez creado y asignado el ticket al departo con la información se procederá a:

  • Si es un componente con carácter general, o solo tienen cabida dentro del catálogo del proyecto.
  • En caso de determinar que es un componente general
    • Analizar la necesidad y evaluar si algún componente existente cubre la necesidad
    • Se responderá al ticket con la estimación (fecha y versión) de diseño (en caso de ser necesario) y del desarrollo del componente
    • En caso de ser necesario, se realizará el diseño del componente y se publicará en el sistema de diseño
    • Se publicará en el catálogo de componentes el componente solicitado
UI Expand
titleNecesito una funcionalidad no provista por un componente del catálogo general

En caso de necesitar una nueva funcionalidad de un componente  dentro de los desarrollados por el equipo del catálogo de componentes, se debe crear un ticket Jira de decisión técnica (Tarea genera → tipo: decisión → subtipo: técnica) y asignársela al responsable del departamento LUIS MARTINEZ FONTIVEROS

El ticket deberá contener:

  • La explicación de la necesidad funcional
  • El diseño, alineado con las directrices marcadas por el sistema de diseño, por parte del equipo de UX asignado al proyecto
  • Una entrada en la tabla que identifica los componentes utilizados en el proyecto

Una vez creado y asignado el ticket al departo con la información se procederá a:

  • Si es un necesidad que encaja dentro de un componente con carácter general, o solo tienen cabida dentro del catálogo del proyecto.
  • En caso de determinar que es un componente general
    • Analizar la necesidad y evaluar si algún otro componente existente cubre la necesidad
    • Se responderá al ticket con la estimación (fecha y versión) de diseño (en caso de ser necesario) y del desarrollo de la nueva funcionalidad del componente
    • En caso de ser necesario, se realizará el diseño de la nueva funcionalidad del componente y se publicará en el sistema de diseño
    • Se publicará en el catálogo de componentes la nueva funcionalidad del componente solicitada
UI Expand
titleComo actuo si tengo una incidencia de un componente general

En caso de detectar un error en alguno de los componentes desarrollados por el equipo del catálogo de componentes, se debe comunicar al responsable técnico del proveedor para que se ponga en contacto con el departamento de arquitectura.

En caso de que el proveedor no disponga de un referente tecnológico, se debe crear una CGES al departamento de arquitectura de la stic con la incidencia y la mayor información de contexto posible que nos permita evaluar el error y reproducirlo y dar una estimación (fecha y versión) de resolución del error

UI Expand
titleTengo una necesidad de desarrollo que contradice la normativa

En caso de que un proyecto tenga una necesidad que entre en conflicto con la normativa de desarrollo redactada, se deberá crear un ticket Jira de decisión técnica (Tarea genera → tipo: decisión → subtipo: técnica) y asignársela al responsable del departamento LUIS MARTINEZ FONTIVEROS

Una vez asignada, el departamento analizará la necesidad y dará respuesta dentro del mismo ticket.

Recursos

En esta sección podrás encontrar preguntas relativas a que ofrece y que no ofrece el SAS

UI Expand
titleExisten un catálogo de componentes implementados

SI.

Explicación:

  • Existe un equipo encargado de desarrollar y mantener un catálogo de componentes, el cual se puede consultar, ver la información, probar y configurar en directo a través de su playground.
  • Tanto los nuevos componentes como los existentes se busca alinearlos con las directrices marcadas en el sistema de diseño.
  • Los componentes están con constante evolución tratando de mantener una retrocompatibilidad dentro de la misma versión mayor.
  • Si quiere mantenerse al día de los cambios que ocurren en el catálogo suscríbase al blog 
UI Expand
titleExisten un sistema de diseño

SI, puedes encontrar las directrices de diseño de interfaces de usuario aquí

UI Expand
titleExisten un catálogo de microfrontends implementados

Todavía no, se está trabajando en ello.

UI Expand
titleExisten una plantilla de definición de la api de un microfrontend
Todavía no, se está trabajando en ello.
UI Expand
titleExisten un cdn de recursos estáticos
Todavía no, se está trabajando en ello.
UI Expand
titleExiste un App-Shell

NO.

Explicación:

  • Inicialmente, se barajó la implementación del concepto del app-shell (referencia 1, referencia 2). Pero después de varias aproximaciones, el departamento de arquitectura de la STIC, decidió descartarla por la dificultad que añadía a la solución y dada la lista variopinta de las tecnologías con las que están desarrolladas las aplicaciones del SAS. 
  • Se consideró que gracias a la uniformidad tecnológica en el desarrollo de los microfrontend y el conjunto de estándares, normativas, herramientas, componentes y capabilities ofrecidas daba un marco completo de trabajo para poder integrar los microfrontales en el heterogéneo catálogo del SAS

Integración

En esta sección podrás encontrar preguntas relativas a la integración de un microfrontend dentro de una aplicación.

UI Expand
titleComo integrar un microfrontend

c

UI Expand
titleComo integrar un microfrontend de forma aislada

c

UI Expand
titlePuedo integrar una aplicación embebida como un microfrontend

c

UI Expand
titleComo puedo integrar un microfrontend en buildtime

c

UI Expand
titleComo puedo integrar un microfrontend en runtime

c

UI Expand
titleComo integrar un microfrontend con diferencias estilísticas

c

UI Expand
titleTengo conflictos tecnológicos al integrar un microfrontend

c

UI Expand
titleComo integrar un microfrontend con seguridad

c

UI Expand
titleComo me comunico con un microfrontend

c

UI Expand
titleComo comunico dos microfrontends

c

UI Expand
titleComo navego dentro de un microfrontend

c

UI Expand
titleComo configuro un microfrontend

c

UI Expand
titleComo comparto el estado con un microfrontend

c

UI Expand
titleComo versiona un microfrontend

c