Web Components
LICZBA DNI: 2 (16h)
KOD KURSU: WEB/COMPONENTS
Weź udział w szkoleniu
Termin
Lokalizacja
Cena / os
27
maja
Warszawa,
Kraków,
Łódź,
Wrocław,
Gdańsk,
Poznań,
Zdalne,
Termin
27
maja
Lokalizacja
Warszawa,
Kraków,
Łódź,
Wrocław,
Gdańsk,
Poznań,
Zdalne,
Cena / os
Powiadom
o kolejnych terminach
O szkoleniu
DLA KOGO?
Dla programistów chcących zapoznać się ze standardem WebComponents
WYMAGANIA
Podstawowa znajomość JavaScript
ZALETY
Szkolenie Web components reprezentuje podejście warsztatowe - zestaw poruszanych zagadnień i ćwiczeń skonstruowany w taki sposób, aby uczestnik w wyniku szkolenia zaimplementował typowe rozwiązania spotykane w realnych projektach
Cele szkolenia
Szkolenie Web components umożliwia poznanie założeń i zastosowań Web Components oraz narzędzi umożliwiających wydajną pracę z tymi technologiami
Program
Podstawy Web Components
- Czym są Web Components?
- Gdzie i dlaczego warto ich używać?
- Ograniczenia
Specyfikacje w praktyce
- Custom Elements
- Shadow DOM
- ES Modules
- HTML Template
Wprowadzenie do warsztatu
- Odświeżenie podstaw ES2015 (klasy, template strings)
- Konfiguracja środowiska pracy
- Definicja pierwszego komponentu
API Web Components
- Cykl życia
- Obsługa zdarzeń
- Definicje atrybutów konfigurujących komponent
- Nasłuchiwanie zmian atrybutów
- Sloty
- Definicje własnych zdarzeń
Stylowanie
- Możliwości i ograniczenia
- Tagi style wewnątrz komponentów
- Selektory :host, :host-context i ::slotted
- CSS custom properties
Biblioteki Web Components: Stencil
- Wprowadzenie do Stencil
- Konfiguracja projektu
- Tworzenie komponentów Stencil
- Wprowadzenie do JSX
- Praca z Props
- Obsługa zdarzeń
- Cykl życia komponentu
- Definicja metod
- Przygotowanie na produkcję
Biblioteki Web Components: LitElement
- Wprowadzenie do LitElement
- Porównanie ze Stencil
- Budowa szablonów z lit-html
- Stylowanie
- Praca z Props
- Obsługa zdarzeń
- Cykl życia komponentu
- Przygotowanie na produkcję
Web Components a popularne frameworki/biblioteki
- Angular Elements
- Web Components a Vue
- Integracja z React
