- 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 Vue van SpiralTrain laat je zien hoe je flexibele en schaalbare frontend-architecturen ontwikkelt met Vue.js. Je leert hoe je grote applicaties opsplitst in kleinere micro frontends, deze effectief koppelt en optimaal gebruik maakt van het Vue-ecosysteem voor naadloze integratie.
De cursus Micro Frontends met Vue start met een introductie van het micro frontend concept en de verschillen met monolithische applicaties. Toepassingsgebieden en kernprincipes worden toegelicht met praktijkvoorbeelden uit de industrie.
Daarna volgt een herhaling van de belangrijkste Vue concepten zoals componenten, directives, reactivity, props en events, routing met Vue Router en de Composition API. Dit vormt de basis voor het bouwen van micro frontends.
In dit onderdeel worden architectuurpatronen en ontwerpaanpakken voor Vue micro frontends besproken. Onderwerpen zijn component composition, communicatie via een event bus, routingstrategieën, shell applicaties, lazy loading en error boundaries.
Deelnemers leren hoe Webpack Module Federation wordt toegepast in Vue. Aan bod komen host- en remote-applicaties, dynamische imports, gedeelde libraries, versiebeheer, runtime-integratie en best practices voor configuratie en foutafhandeling.
De integratie van micro frontends wordt behandeld met nadruk op UI-compositie, gedeelde navigatie, cross-app routing en service-integratie. Ook authenticatie, autorisatie en performance monitoring in praktijksituaties worden besproken.
Dit module behandelt state management in Vue. Besproken worden lokale state, props en events, Vuex met modules en moderne alternatieven zoals Pinia. Ook het delen van state tussen apps en debugging tools komen aan bod.
De deployment van micro frontends wordt behandeld met aandacht voor CI/CD pipelines, onafhankelijke releases en omgevingsconfiguraties. Daarnaast komen containerisatie met Docker, deployment op Kubernetes, cloud hosting en rollback-strategieën aan de orde.
De cursus gaat verder met testen van micro frontends in Vue. Unit testing met Vue Test Utils en Jest, integratietesten en end-to-end testen met Cypress worden besproken, evenals automatisering en toegankelijkheidstesten.
De cursus sluit af met geavanceerde onderwerpen zoals security, authenticatie- en autorisatiepatronen, performance optimalisatie, foutafhandeling en cachingstrategieën. Toekomstige trends worden behandeld en in een hands-on project komen alle concepten samen.
De cursus is bedoeld voor Vue.js ontwikkelaars, UI engineers en technisch leads die willen ontdekken hoe micro frontend patronen toegepast kunnen worden in moderne webapplicaties.
Deelnemers dienen een goede kennis te hebben van JavaScript, TypeScript en Vue ontwikkeling. Inzicht in modulaire ontwerpen, web components en tooling zoals Vue CLI of Vite is aanbevolen.
De cursus bestaat uit conceptuele uitleg, begeleide oefeningen en programmeerworkshops. Deelnemers werken aan case-based voorbeelden die aansluiten bij uitdagingen uit de praktijk.
Na afronding ontvangen de deelnemers een certificaat van deelname aan de cursus Micro Frontends met Vue.
Module 1 : Introduction |
Module 2 : Vue Recap |
Module 3 : Architecture |
Micro Frontends Overview Monolith vs Micro Frontends Advantages and Limitations Use Cases Core Principles Team Autonomy Deployment Flexibility Integration Styles Scaling Applications Industry Examples |
Vue Fundamentals Vue Components Directives Basics Reactivity System Props and Events Vue Router Intro Vue CLI Data Binding Lifecycle Hooks Composition API |
Architecture Patterns Component Composition Shared vs Isolated State Event Bus Pattern Routing Strategies Shell Application Cross-App Communication Lazy Loading Modules Error Boundaries Resilience Patterns |
Module 4 : Module Federation |
Module 5 : Integration |
Module 6 : State Management |
Webpack Federation Setup Host and Remote Apps Dynamic Imports Shared Libraries Exposing Components Version Handling Runtime Integration Error Handling Configuration Files Best Practices |
UI Composition Shared Navigation Authentication Integration Authorization Handling Micro Frontend Shell Cross-App Routing Service Integration Performance Monitoring Testing Integration Real-World Scenarios |
State Basics in Vue Local Component State Props and Events Vuex Overview Vuex Store Setup Modules in Vuex Cross-App State Sharing Async State Handling Pinia Introduction Debugging Tools |
Module 7 : Deployment |
Module 8 : Testing |
Module 9 : Advanced Topics |
Deployment Strategies Independent Deployments CI/CD Pipelines Environment Configurations Docker with Vue Kubernetes Deployments Cloud Hosting Options Version Control Rollback Strategies Monitoring Solutions |
Unit Testing Vue Vue Test Utils Jest Framework Integration Testing End-to-End Testing Cypress Framework Contract Testing Test Automation Performance Testing Accessibility Testing |
Security Concerns Authentication Patterns Authorization Patterns Performance Optimization Error Handling Accessibility Concerns Caching Strategies Future Trends Case Studies Hands-On Project |