ArquiteturaEm Breve

Arquitetura de Micro-frontends

Micro-frontends se referem a isolamento módulo por módulo e sobre como isso pode ser implantado, testado e evoluído sem depender do resto. O Dev Showcase por exemplo utiliza o conceito de Feature-Sliced Design, onde cada feature é um módulo completamente a parte do sistema real, possuindo sua propria arquitetura interna que não depende da arquitetura externa para funcionar. Completamente desacoplado do código externo. Esta demo vai tornar essa arquitetura visível — um diagrama interativo da estrutura de módulos — e vai mostrar Module Federation na prática: dois micro-apps compartilhando dependências sem acoplar o deploy de um ao do outro.

Arquitetura Micro-frontends Module Federation Feature-Sliced Design

Tecnologias

  • Webpack 5 Module Federation
  • Feature-Sliced Design
  • Turborepo

Arquitetura

  • Diagrama interativo da estrutura de Feature-Sliced Design do projeto com dois micro-apps carregados via Webpack 5 Module Federation compartilhando dependências

Conceitos

  • Funcionalidades Isoladas
  • Dependências compartilhadas entre micro-apps
  • Deploy independente

Área de demonstração

A demonstração interativa deste recurso estará disponível em breve.

Em Breve

A demonstração interativa de Arquitetura de Micro-frontends está em desenvolvimento. A arquitetura e os detalhes técnicos já estão documentados acima.

Seguir no GitHub
Novas demos são adicionadas regularmente