- Leren door doen
- Trainers met praktijkervaring
- Klassikale trainingen
- Gedetailleerd cursusmateriaal
- Duidelijke inhoudsbeschrijving
- Maatwerk inhoud mogelijk
- Trainingen die doorgaan
- Kleine groepen
In de cursus Developing Web Components van SpiralTrain leren de deelnemers web platform API's zoals te gebruiken om nieuwe zelf gedefinieerde Web Components met een eigen HTML tag, eigen encapsulated styles en eigen gedrag te maken. De deelnemers leren te werken met Custom Elements, Shadow DOM en HTML Templates.
De cursus Developing Web Components biedt een uitgebreid overzicht van Web Components en de voordelen die ze bieden op het gebied van encapsulation, reusability en interoperability. Deelnemers krijgen een fundamenteel inzicht in de belangrijkste concepten en technologieën die ten grondslag liggen aan Web Components, zoals Custom Elements, de Shadow DOM en HTML templates. Deze cursus is essentieel voor ontwikkelaars die moderne webtoepassingen willen bouwen met herbruikbare componenten.
Vervolgens wordt aandacht besteed aan de manier waarop Custom Elements kunnen worden gedefinieerd en gebruikt. Onderwerpen zijn onder meer de life cycle van Custom Elements, properties, attributes en events, evenals best practices voor het maken en uitbreiden van Custom Elements. Door deze kennis kunnen deelnemers effectievere en onderhoudbare webcomponenten creëren.
Ook komen ES modules aan bod die modulaire code organisatie en dependency management bij JavaScript development mogelijk maken. Onderwerpen zijn de creatie van ES modules en het importeren en exporteren van ES modules. Ook komt aan de orde hoe projecten met behulp van dit krachtige module systeem kunnen worden gestructureerd, wat cruciaal is voor het ontwikkelen van complexe applicaties.
De Shadow DOM wordt diepgaand besproken, waarbij wordt uitgelegd hoe je styling en markup binnen Web Components kunt inkapselen. Dit garandeert isolatie en voorkomt style leakage. Er wordt aandacht besteed aan het creëren van Shadow Roots, het stylen van Shadow DOM content en het gebruik van slots voor content projection, wat de flexibele interactie tussen componenten bevordert.
Een belangrijk onderdeel van de cursus Developing Web Components zijn de HTML templates waarmee herbruikbare markup structuren worden gedefinieerd. Er wordt uitgelegd hoe HTML templates encapsulation en instantiatie van complexe HTML structuren mogelijk maken, waardoor een flexibele en efficiënte component compositie in web applicaties mogelijk wordt.
Tenslotte worden geavanceerde technieken en patterns voor het ontwikkelen van Web Components behandeld. Hierbij komen de samenstelling en communicatie tussen Web Components aan bod, evenals het integreren van Web Components in microservices architecturen en het optimaliseren van prestaties en toegankelijkheid. Deze geavanceerde kennis stelt ontwikkelaars in staat om innovatieve en schaalbare weboplossingen te creëren.
Voor meer informatie over het ontwikkelen met JavaScript, bekijk de cursus JavaScript Programmeren. Voor aanvullende technieken en diepere inzichten in JavaScript, is de cursus Advanced JavaScript Programmeren ook aan te raden. Voor meer details over moderne frameworks, kun je de cursus React Fundamentals overwegen. Daarnaast kun je meer leren over Web Components op de officiële Web Components site.
De cursus Developing Web Components is bestemd voor Web Developers die willen leren hoe Web Components in moderne web applicaties kunnen worden toegepast.
Om aan deze cursus te kunnen deelnemen is goede kennis van de basis van Web Applicaties met HTML en CSS en kennis van JavaScript vereist.
De theorie wordt uitgelegd met slides en demos. De cursus heeft een hands-on karakter. Uitleg wordt afgewisseld met oefeningen.
De deelnemers krijgen na het goed doorlopen van de cursus een certificaat van deelname aan Web Components.
Module 1 : Intro Web Components |
Module 2 : Custom Elements |
Module 3 : ES Modules |
|
What are Web Components? Benefits of Web Components Web Component Specifications Custom Elements Shadow DOM Style Encapsulation ES Modules HTML Templates Browser Support Environment Setup Create First Web Component |
Intro Custom Elements Defining Custom Elements Lifecycle Hooks Attributes and Properties Event Handling Extending Built-in Elements Naming Conventions JavaScript Libraries Platform API's Polyfills Browser Compatibility |
ECMA Standard Module Systems CommonJS Modules Asynchronous Module Definition Internal Modules External Modules Imports and Exports Module Scopes Module Instantiation Dependency Graphs WebAssembly Integration |
Module 4 : Shadom DOM |
Module 5 : HTML Templates |
Module 6 : Advanced Web Components |
|
What is Shadow DOM? Encapsulation Creating Shadow Roots Styling Shadow DOM Content Scoped CSS Variables Shadow DOM Slots Shadow DOM Events Manipulating Shadow DOM Content CSS Encapsulation CSS Inheritance Debugging Shadow DOM |
What are HTML Templates? Creating HTML Templates Content Insertion Markup Fragments Template Cloning Template Instantiation Parameterized Templates Dynamic Templates Template Accessibility Templating Engines Template Libraries |
Composing Web Components Component Interaction Custom Events Shadow DOM Composition Slot Receptacles Named Slots Conditional Rendering Internationalization Single Page Applications Microservices Architecture Responsive Web Components |
Deze bedrijven en instanties waren u al voor:
Deze bedrijven waren u voor:
