Déploiement de votre propre HTML avec des composants web
Rejoignez Raymond Camden, développeur évangéliste chez Adobe, pour découvrir les bases des composants web, y compris les éléments personnalisés, le modèle DOM fantôme et les modèles d’HTML. Explorez des exemples concrets tels que l’incorporation de PDF et la création de tableaux triables pour améliorer vos applications grâce à des solutions réutilisables et modernes.
Discussions communautaires
Poursuivez la conversation dans la communauté Adobe Developers Live discussion.
Points clés
- Présentation des composants web Les composants web permettent aux développeurs de créer des éléments d’HTML personnalisés avec leur propre apparence et interactivité, définis à l’aide de JavaScript.
- Les composants Web Core Technologies sont créés à l’aide de trois technologies principales** des éléments personnalisés, des DOM fantômes et des modèles d’HTML.
- Eléments personnalisés Les éléments personnalisés permettent de créer des balises d’HTML. Ils doivent utiliser la casse de la tabulation et inclure un tiret. Les classes JavaScript sont utilisées pour définir leur comportement.
- DOM fantôme Le DOM fantôme fournit l’encapsulation pour l’arborescence DOM d’un composant, empêchant les fuites CSS et permettant un style plus contrôlé.
- Modèles d’HTML Les modèles d’HTML permettent de définir des HTMLS et des feuilles de style CSS qui peuvent être clonés et ajoutés au DOM. Cependant, le présentateur préfère utiliser des créneaux plutôt que des modèles pour une meilleure distribution et plus de flexibilité.
- Attributs et événements Les éléments personnalisés peuvent avoir des attributs et des gestionnaires d’événements, tels que connectCallback et disconnectCallback, pour gérer leur comportement lorsqu’ils sont ajoutés ou supprimés du DOM.
- Emplacements Les emplacements permettent l’insertion de contenu dans les composants web, prenant en charge les emplacements par défaut et nommés pour une gestion de contenu plus flexible.
- Exemples réels : une visionneuse incorporée de PDF, des espaces réservés d’image et un tri de tableau, ce qui montre les applications pratiques des composants web.
- Amélioration progressive Les composants web peuvent améliorer l’HTML existant sans rompre la fonctionnalité si JavaScript ne parvient pas à se charger complètement.
- Étapes suivantes et ressources La présentation suggère d’explorer la participation au formulaire, le DOM fantôme déclaratif, les attributs d’HTML personnalisés et le rendu côté serveur. Les ressources incluent MDN, webcomponents.org, et le livre "Web Components in Action" de Ben Farrell.
recommendation-more-help
3c5a5de1-aef4-4536-8764-ec20371a5186