WebComponents

Working Examples, Snippets, Collections and Exploration of WebComponents.

Requirements

The web components consists of three main technologies, which can be used together to create versatile custom elements with encapsulated functionality that can be reused wherever you like without fear of code collisions.

• Custom Elements

• Shadow Dom

• Html templates

These functions are generally implemented and available in most browsers.

How it Works

• The Custom Elements is used to create the Custom component's fully valid HTML tag.

  Note: The custom name must contain a dash (-) (E.g: custom-element).

• The Shadow Dom isolates the Custom Elements tag from other elements.

  Note: The Isolation works similar to <iframe>.

• The Html templates are used for the giving the functionality, styling to the Custom Elements.

More more detailed information click here