Reusing independent components across multiple websites was always a bit painful up to now. You had to manually include CSS styles that can override your already existing styles, JavaScripts, copy and paste necessary HTML code, and usually in the end, write at least small JavaScripts.

For this reason, W3C is working on a specification called Web Components (http://webcomponents.org/). This is a set of standards that makes creating and reusing components very easy.

In the first part of this chapter, we'll take a look at what Web Components are and how they work in Dart while implementing one after another. We'll also quickly compare implementation in Dart and JavaScript.

In the second part, we're going to take a look at polymer.dart. Polymer is a JavaScript framework built on Web Components. Polymer.dart is its port to Dart. We'll use it for the bookshelf example from the previous chapter and see how it can help us write more encapsulated components...