Web Components in Action

Workshop Prerequisites

To be prepared for the workshop you will need to have recently-installed working versions of git, bower, and node.js/npm.

In this workshop we will be using Bower, the front-end package management system. In addition, you will need to clone the git repository with examples and exercises to fully participate. Before you come tomorrow, you should:

• Install git or one of the GitHub clients for your operating system.
• Install Node.js on your system
• Install Bower by entering “npm install -g bower” into the terminal
• Install the dev channel of Chrome for your machine
• Go to chrome://flags and enable “Experimental Web Platform Features” and “HTML Imports”

Workshop Description

Attendees will learn the what, why, and how of the Web Components specification as well as practical applications you can use today by leveraging the Polymer library. Topics will include:

• What are Web Components?
  • Custom Elements
  • Shadow DOM
  • Template Tags
  • Template Binding
• Why use Web Components?
• Using Web Components Today
  • Browser Compatibility
  • Polymer
  • X-Tags
• Building Interface Components
  • Defining a Schema
  • Building the Custom Element
  • Using Your Custom Component
  • Packaging and Distributing Components
• Building Non-Visual Components