Class Central is learner-supported. When you buy through links on our site, we may earn an affiliate commission.

Pluralsight

HTML5 Web Component Fundamentals

via Pluralsight

Overview

Learn how to use the Shadow DOM, Custom Elements, Templates, and Imports to create reusable web components in this online HTML course.

In this course, you'll learn how HTML5 Web Components give us the power to extend the web with our own rich, standards-based components. Web developers have been struggling for years to create truly reusable components. We struggle with styling, bundling, defining templates, and encapsulating our markup and styles from accidental manipulation. But HTML5 Web Components provide the power to finally define standards-based, reusable web components through four new technologies. Learn how to use the Shadow DOM to encapsulate the DOM and styling for your components. Define inert templates with the template tag. Extend HTML by registering your custom elements. And bundle this all together in a simple reusable package using HTML5 imports.

Syllabus

  • Five Problems, One Solution 23mins
  • Templates 27mins
  • Custom Elements 43mins
  • Shadow DOM Fundamentals 34mins
  • Shadow DOM Insertion Points & Events 53mins
  • Shadow DOM Styling 51mins
  • Imports 56mins
  • Native Alternatives 10mins
  • Resources 2mins

Taught by

Cory House

Reviews

4.6 rating at Pluralsight based on 489 ratings

Start your review of HTML5 Web Component Fundamentals

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Someone learning on their laptop while sitting on the floor.