Skip to content

All Access Membership: every course in one subscriptionBrowse courses

For teams Start coding

Front End · Beginner · 2h 24m

HTML 5 Web Component Fundamentals

Build reusable, accessible page components with modern HTML 5.

Start the course

About this course

This course explains how modern pages are structured and how to build your own web components. You will write semantic markup, use templates and custom elements, and combine them into a small component library.

What you'll learn

  • Semantic HTML 5 structure and accessibility basics

  • Forms, media and the most useful new elements

  • Templates, slots and custom elements

  • Shadow DOM and encapsulated styles

  • How to organise a reusable component library

Course content

HTML 5 Lessons

  1. How a page is built

    How a page is built and which elements to use.

  2. Text, media and forms

    Text, links, media and forms in practice.

  3. Custom elements and the shadow DOM

    Custom elements, templates and the shadow DOM.

Finally I understand what web components are and how to use them in my own projects.
— Samer Atallah, Web developer

Subscribe

All Access Membership

One subscription unlocks every course, new lessons each month and member-only coding challenges.

Join All Access