Micro-frontends Angular
Module federation, arquitetura de micro-frontends, dependências compartilhadas, estratégias de implantação, padrões de comunicação
1O que é uma arquitetura de micro-frontend no contexto Angular?
O que é uma arquitetura de micro-frontend no contexto Angular?
Resposta
Uma arquitetura de micro-frontend divide uma aplicação Angular monolítica em aplicações independentes menores, cada uma desenvolvida e implantada separadamente. Cada micro-frontend pode ter seu próprio repository, pipeline CI/CD e equipe dedicada. O Module Federation do Webpack 5 é a tecnologia recomendada para implementar essa arquitetura no Angular, permitindo carregar dinamicamente código de outras aplicações em runtime.
2Qual é o papel do Module Federation em uma arquitetura de micro-frontend Angular?
Qual é o papel do Module Federation em uma arquitetura de micro-frontend Angular?
Resposta
O Module Federation permite compartilhar código entre aplicações Angular em runtime sem rebuild. Cada micro-frontend expõe módulos (remotes) que podem ser consumidos por outras aplicações (hosts). Isso evita a duplicação de código, reduz o tamanho dos bundles e permite implantações independentes. O Module Federation gerencia automaticamente o carregamento assíncrono, a resolução de dependências e o compartilhamento de bibliotecas comuns como o Angular core.
3Qual é a diferença entre uma aplicação host e uma aplicação remote no Module Federation?
Qual é a diferença entre uma aplicação host e uma aplicação remote no Module Federation?
Resposta
A aplicação host consome módulos expostos pelos remotes. Ela configura os remotes em seu webpack.config e carrega seus módulos dinamicamente. Uma aplicação remote expõe módulos (components, services) para serem consumidos por outras aplicações. Uma mesma aplicação pode ser tanto host quanto remote. O host controla o shell da aplicação (header, navigation, layout) enquanto os remotes fornecem as funcionalidades de negócio.
Como configurar o Module Federation em um projeto Angular com @angular-architects/module-federation?
Por que é importante configurar o shared scope no Module Federation?
+17 perguntas de entrevista
Outros temas de entrevista Angular
Fundamentos do TypeScript
TypeScript Avançado
Fundamentos do Angular
Componentes e ciclo de vida
Services & Dependency Injection
Organização de Módulos Angular
Angular CLI
Diretivas e Pipes
Routing e Navegação
Formulários reativos
Formulários template-driven
Fundamentos do RxJS
Operadores RxJS
HttpClient e chamadas de API
Gerenciamento de estado básico
Change Detection
Angular Signals
Standalone Components
Testes unitários em Angular
Testes End-to-End
Build e otimização
Fundamentos do NgRx
NgRx avançado
Arquitetura Angular
Otimização de desempenho
Segurança e boas práticas
Padrões avançados de RxJS
Angular Universal e SSR
Domine Angular para sua proxima entrevista
Acesse todas as perguntas, flashcards, testes tecnicos, exercicios de code review e simuladores de entrevista.
Comece gratis