Une formation Lit, le successeur de Polymer créé par Google, pour créer facilement des Web Components réutilisables dans n’importe quel type de projet !
Pourquoi une formation Lit / Polymer ?
Les composants se sont imposés comme la structure centrale dans le développement JavaScript. Mais jusqu’à maintenant, il n’y avait aucune interopérabilité : un composant React ne fonctionne que dans des projets React, un composant Angular ne fonctionne que dans des projets Angular.
LitElement va vous aider à créer des Web Components natifs : c’est-à-dire que vous pourrez les réutiliser dans n’importe quel projet, qu’il s’agisse d’un site web ou d’une application créée avec un framework JavaScript (que ce soit Angular, React ou Vue).
Lit est le remplaçant et l’aboutissement de Polymer, qui fut la première librairie à parier sur le standard des Web Components.
Une formation Lit / Polymer : pour qui ?
Cette formation s’adresse aux développeurs :
- la connaissance d’un langage quelconque suffit (PHP, Java, C#…) : les guides de préparation vous permettront de vous mettre à niveau en JavaScript avant le formation,
- elle n’est pas adaptée à des débutants en programmation.
Objectifs de la formation Lit / Polymer
- Créer des composants web réutilisables dans n’importe quel type de projet
- Maîtriser Lit et le standard des Web Components
Programme de la formation Lit / Polymer
Ce programme a vocation à être personnalisé.
Web Components standards
Nous faisons d’abord un tour rapide des Web Components natifs et de leurs limites, pour comprendre et mettre en perspective les avantages de Lit.
- Shadow DOM
- Custom Elements
TypeScript
Comme quasiment tous les outils JavaScript aujourd’hui, Lit utilise TypeScript. Nous faisons donc un rappel des fondamentaux de TypeScript.
Composants Lit
- Render
- Décorateurs
- Cycle de vie
- Propriétés
Templating
- Conditions et boucles
- Data-binding
- Evénements
- Slots
Styles
- Gérer les styles du composant
- Theming
Distribution
- Transpilation en JavaScript natif
- Utilisation dans les frameworks (React, Angular, Vue)
- Distribution sur npm