# Angular Micro-frontends (Angular)

> Module federation, architektura micro-frontend, współdzielone zależności, strategie wdrożenia, wzorce komunikacji

- 20 pytań z rozmów
- Senior
- [Pytania z rozmów: Angular](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne.md)

## 1. Czym jest architektura micro-frontend w kontekście Angulara?

**Odpowiedź**

Architektura micro-frontend dzieli monolityczną aplikację Angular na mniejsze, niezależne aplikacje, z których każda jest rozwijana i wdrażana osobno. Każdy micro-frontend może mieć własne repository, pipeline CI/CD i dedykowany zespół. Module Federation z Webpack 5 to zalecana technologia do implementacji tej architektury w Angular, umożliwiająca dynamiczne ładowanie kodu z innych aplikacji w runtime.

## 2. Jaka jest rola Module Federation w architekturze micro-frontend Angular?

**Odpowiedź**

Module Federation umożliwia współdzielenie kodu między aplikacjami Angular w runtime bez rebuildu. Każdy micro-frontend udostępnia moduły (remotes), które mogą być konsumowane przez inne aplikacje (hosts). Pozwala to uniknąć duplikacji kodu, zmniejszyć rozmiar bundle i umożliwia niezależne wdrożenia. Module Federation automatycznie obsługuje asynchroniczne ładowanie, rozwiązywanie zależności i współdzielenie wspólnych bibliotek takich jak Angular core.

## 3. Jaka jest różnica między aplikacją host a aplikacją remote w Module Federation?

**Odpowiedź**

Aplikacja host konsumuje moduły udostępniane przez remote. Konfiguruje remote w swoim webpack.config i ładuje ich moduły dynamicznie. Aplikacja remote udostępnia moduły (component, service) do konsumpcji przez inne aplikacje. Ta sama aplikacja może być zarówno host, jak i remote. Host kontroluje shell aplikacji (header, navigation, layout), podczas gdy remote dostarczają funkcjonalności biznesowych.

## Jeszcze 17 dostępnych pytań

- Jak skonfigurować Module Federation w projekcie Angular z @angular-architects/module-federation?
- Dlaczego ważne jest skonfigurowanie shared scope w Module Federation?

Zarejestruj się za darmo: https://sharpskill.dev/pl/login

## Inne tematy rekrutacyjne Angular

- [Podstawy TypeScript](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/typescript-basics.md): 25 pytań, Junior
- [TypeScript zaawansowany](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/typescript-advanced.md): 20 pytań, Junior
- [Podstawy Angulara](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/angular-fundamentals.md): 20 pytań, Junior
- [Komponenty i cykl życia](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/components-lifecycle.md): 20 pytań, Junior
- [Services & Dependency Injection](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/services-dependency-injection.md): 20 pytań, Junior
- [Organizacja modułów Angular](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/modules-organization.md): 22 pytań, Mid-Level
- [Angular CLI](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/angular-cli.md): 18 pytań, Junior
- [Dyrektywy i Pipe'y](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/directives-pipes.md): 22 pytań, Mid-Level
- [Routing i Nawigacja](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/routing-navigation.md): 24 pytań, Mid-Level
- [Formularze reaktywne](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/forms-reactive.md): 26 pytań, Mid-Level
- [Formularze template-driven](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/forms-template-driven.md): 16 pytań, Mid-Level
- [Podstawy RxJS](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/rxjs-fundamentals.md): 22 pytań, Mid-Level
- [Operatory RxJS](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/rxjs-operators.md): 24 pytań, Mid-Level
- [HttpClient i wywołania API](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/http-client.md): 22 pytań, Mid-Level
- [Podstawowe zarządzanie stanem](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/state-management-basics.md): 20 pytań, Mid-Level
- [Change Detection](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/change-detection.md): 20 pytań, Mid-Level
- [Angular Signals](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/angular-signals.md): 20 pytań, Mid-Level
- [Standalone Components](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/standalone-components.md): 18 pytań, Mid-Level
- [Testy jednostkowe w Angular](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/testing-unit.md): 22 pytań, Mid-Level
- [Testowanie End-to-End](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/testing-e2e.md): 18 pytań, Mid-Level
- [Build i optymalizacja](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/build-optimization.md): 20 pytań, Mid-Level
- [Podstawy NgRx](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/ngrx-fundamentals.md): 24 pytań, Senior
- [Zaawansowany NgRx](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/ngrx-advanced.md): 24 pytań, Senior
- [Architektura Angular](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/angular-architecture.md): 22 pytań, Senior
- [Optymalizacja wydajności](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/performance-optimization.md): 22 pytań, Senior
- [Bezpieczeństwo i najlepsze praktyki](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/security-best-practices.md): 20 pytań, Senior
- [Zaawansowane wzorce RxJS](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/advanced-rxjs-patterns.md): 22 pytań, Senior
- [Angular Universal i SSR](https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/angular-universal-ssr.md): 20 pytań, Senior

---

Source: SharpSkill (https://sharpskill.dev), tech interview preparation for your real stack.
HTML version of this page: https://sharpskill.dev/pl/technologies/angular/pytania-rekrutacyjne/micro-frontends-angular