From the course: Learning Web Components

Unlock the full course today

Join today to access over 22,600 courses taught by industry experts or purchase this course individually.

Create reusable modules

Create reusable modules

From the course: Learning Web Components

Start my 1-month free trial

Create reusable modules

- [Instructor] Now that we've seen how to use imports to create standalone HTML that can be easily included into webpages, let's try our hand at building a basic, reusable module. One of the downsides of the previous import example was that we needed to write some boilerplate code to get the template out of the import document. And obviously, it would be a big improvement if the template could just automatically add itself to the page that is importing it. And that's what we're going to do in this example. So let's open the import2_start file and let's also open the component file. So let's start by looking at the component file. In this example, you can see that in addition to the template code, there's also some script included in the file. The script runs when the import file is loaded. It automatically adds the template to the importing page. The first line gets a reference to the import document itself. In other words, this file that contains the template, it does so by using the…

Contents