- Leren door doen
- Trainers met praktijkervaring
- Klassikale trainingen
- Gedetailleerd cursusmateriaal
- Duidelijke inhoudsbeschrijving
- Maatwerk inhoud mogelijk
- Trainingen die doorgaan
- Kleine groepen
De cursus Micro Frontends met Angular van SpiralTrain leert je hoe je schaalbare frontend-architecturen ontwerpt en implementeert met Angular. Je leert hoe je grote applicaties opdeelt in beheersbare micro frontends, deze naadloos integreert en technieken toepast voor onafhankelijke deployment en teamautonomie.
De cursus Micro Frontends met Angular biedt een uitgebreide introductie tot het concept van micro frontends. We beginnen met een overzicht van de verschillen tussen monolithische applicaties en micro frontends. Hierbij worden de toepassingsgebieden van micro frontend architecturen besproken, evenals belangrijke principes en praktijkvoorbeelden die de relevantie van deze aanpak benadrukken.
Vervolgens wordt er een korte herhaling gegeven van de belangrijkste Angular-concepten, zoals componenten en templates, dependency injection, modules, routing en change detection. Deze basis vormt de opmaat naar de implementatie van micro frontends en zorgt ervoor dat deelnemers goed voorbereid zijn voor de volgende stappen.
Daarna wordt ingegaan op architectuurpatronen en ontwerpkeuzes. Onderwerpen zoals domeingedreven ontwerp, communicatie tussen componenten, het gebruik van een event bus en strategieën voor lazy loading en versiebeheer komen uitgebreid aan bod.
In dit onderdeel leren deelnemers werken met Webpack Module Federation. Er wordt ingegaan op host- en remote-applicaties, dynamische imports, het delen van libraries en best practices bij runtime-integratie. Dit is cruciaal voor het succesvol toepassen van micro frontends in Angular-projecten.
Deze module behandelt de integratie van micro frontends in een complete applicatie. Onderwerpen zoals routing-integratie, UI-compositie en cross-app communicatie worden behandeld, evenals de rol van een micro frontend shell en de koppeling van authenticatie en autorisatie.
Vervolgens staat state management centraal in de cursus. De problemen rond gedeelde state en de toepassing van NgRx met stores, selectors en reducers voor een consistente en onderhoudbare state-afhandeling worden uitgebreid besproken.
Daarna komt de deployment van micro frontends aan bod, met aandacht voor CI/CD pipelines, onafhankelijke deployments, containerisatie met Docker en hostingopties in Kubernetes en de cloud.
In dit onderdeel worden de belangrijkste testmethoden besproken, waaronder unit- en integratietesten, end-to-end testen met Cypress en contract testing. Testautomatisering en performance testing worden ook kort aangestipt.
De cursus sluit af met geavanceerde onderwerpen zoals security en toegangscontrole, foutafhandeling met error boundaries, performance optimalisatie en een praktijkcase waarin alle concepten samenkomen. Voor meer informatie over Angular en zijn mogelijkheden, kun je de officiële documentatie van Angular bekijken. Daarnaast is het interessant om meer te leren over Microservices .NET en hoe microservices samen met micro frontends kunnen functioneren.
De cursus is bedoeld voor Angular ontwikkelaars, frontend engineers en software architecten die willen leren hoe ze schaalbare applicaties kunnen ontwerpen, bouwen en onderhouden met behulp van een micro frontend architectuur.
Deelnemers dienen een goede kennis te hebben van JavaScript, TypeScript en Angular ontwikkeling. Bekendheid met web components, modulaire architecturen en build tools is een pré.
De cursus bestaat uit theoretische sessies afgewisseld met praktische labs onder begeleiding van een ervaren trainer. Realistische praktijkvoorbeelden staan centraal in de training.
Na afloop ontvangen de deelnemers een certificaat van deelname aan de cursus Micro Frontends met Angular.
Module 1 : Introduction |
Module 2 : Angular Recap |
Module 3 : Architecture |
|
Micro Frontends Overview Monolith vs Micro Frontends Benefits and Challenges Use Cases Key Principles Architecture Styles Integration Approaches Deployment Strategies Scaling Teams Real-World Examples |
Angular Fundamentals TypeScript Essentials Components and Templates Services and Dependency Angular CLI Modules and Imports Data Binding Directives Basics Routing Essentials Angular Change Detection |
Micro Frontend Concepts Architecture Patterns Domain-Driven Design Shared vs Isolated State Component Communication Event Bus Pattern Routing Strategies Lazy Loading Versioning Strategies Resilience Patterns |
Module 4 : Module Federation |
Module 5 : Integration |
Module 6 : State Management |
|
Webpack Module Federation Host and Remote Apps Dynamic Imports Shared Libraries Version Compatibility Exposing Components Runtime Integration Configuration Files Error Handling Best Practices |
Routing Integration UI Composition Shared Navigation Shared Services Cross-App Communication Micro Frontend Shell Authentication Integration Authorization Handling Performance Monitoring Testing Integration |
State Management Intro Local Component State Shared State Issues NgRx Overview NgRx Store Setup Selectors and Actions Reducers and Effects Cross-App State Sharing State Synchronization State Debugging Tools |
Module 7 : Deployment |
Module 8 : Testing |
Module 9 : Advanced Topics |
|
Deployment Strategies CI/CD Pipelines Independent Deployments Version Management Environment Configurations Containerization Basics Docker with Angular Kubernetes Deployments Cloud Hosting Options Rollback Strategies |
Unit Testing Angular Integration Testing E2E Testing Basics Jest with Angular Cypress Framework Contract Testing Test Automation Performance Testing Accessibility Testing Testing Best Practices |
Micro Frontend Security Authentication Patterns Authorization Patterns Error Boundary Handling Accessibility Concerns Performance Optimization Caching Strategies Future Trends Case Studies Hands-On Project |