Création de Web Components - Pour débutants

Description

Cette formation vidéo a été conçue pour les programmeurs JavaScript qui veulent apprendre à créer des composants Web. En d'autres termes, des balises HTML personnalisées.

Elle est divisée en quatre grandes parties :

• Rappels ECMAScript 6 - Rappels sur l'évolution ECMAScript 6 de JavaScript. Ces notions seront utilisées tout au long de la formation. Si vous connaissez déjà les arrow functions, les classes JavaScript, la notion d'héritage, l'opérateur spread et le destructuring, vous pouvez directement passer à la deuxième partie.

• Préparation de l'environnement de développement - Installation de Visual Studio Code et découverte du plugin Emmet. Si VS Code est déjà installé sur votre ordinateur et si vous connaissez Emmet, vous pouvez directement passer à la troisième partie.

• Première approche des composants Web - Apprentissage pas à pas et par la pratique de tout ce que vous devez savoir pour créer des composants Web : injection de contenu dans le DOM, écoute événementielle dans un composant, isolation du composant du reste du DOM, cycle de vie des composants, shadow DOM, slots, écoute des attributs, style des composants, etc.

• Développement de composants - Dans cette partie, je vous propose d'appliquer ce que vous avez appris pour créer cinq composants très différents. Je vous donne les consignes pour chaque composant et c'est vous qui codez à partir de zéro. Une correction est proposée pour chaque exercice et les fichiers source sont fournis.

  
  

Lorsque je me suis lancé dans la création de cette formation vidéo, deux choix s'offraient à moi :

• Créer un fil rouge et y intégrer petit à petit les différents concepts appris tout au long de la formation.

• Créer des exemples indépendants pour apprendre facilement et rapidement les différents concepts liés à la création de composants.

Je suis formateur en présentiel et en distanciel, et j'ai pu expérimenter ces deux approches. Bien que la première ait ses fervents adeptes, la seconde donne de meilleurs résultats au niveau de l'apprentissage, car chaque exemple peut être choisi de façon extrêmement précise, sans avoir à suivre une logique d'intégration globale qui pourrait faire négliger certains aspects de ce qui doit être appris. C'est donc cette seconde approche qui a été adoptée.

Dans la troisième partie, chaque sujet est abordé de façon indépendante et illustre un aspect particulier de la création de composants. Quand vous aurez terminé la troisième partie, vous serez en mesure de créer des composants de tous types. C'est le but de la quatrième partie.

Quel que soit votre niveau actuel en programmation Web, je vous garantis qu'à la fin de ce cours, vous saurez créer toutes sortes de composants Web. Il ne vous restera plus qu'à les utiliser pour faciliter vos développements front-end.

Mais attention, je répète qu'il s'agit d'une formation pour débutants. Si vous savez déjà créer des composants Web, passez votre chemin, cette formation n'est pas faite pour vous. Par contre, si vous savez (au moins un peu) coder en HTML, CSS et JavaScript et que vous voulez apprendre à créer des composants Web, cette formation est parfaitement adaptée pour vous.

Un manuel illustré complet est accessible à la fin du cours. Il reprend le contenu intégral de la formation.

Je ne peux vous conseiller qu'une chose : codez et progressez à votre rythme. Petit à petit, la création de composants Web sera une seconde nature et vous apprécierez leur puissance et leur souplesse.

Alors ... Happy coding !

TAKE THIS COURSE