Polymer TodoMVC Example

Polymer is a new type of library for the web, built on top of Web Components, and designed to leverage the evolving web platform on modern browsers.

Polymer - www.polymer-project.org

Learning Polymer

The Polymer website is a great resource for getting started.

Here are some links you may find helpful:

• Getting Started
• FAQ
• Browser Compatibility

Get help from Polymer devs and users:

• Find us on IRC on #polymer at freenode.
• Join the high-traffic polymer-dev Google group or the announcement-only polymer-announce Google group.

Implementation

The Polymer implementation of TodoMVC has a few key differences with other implementations:

• Since Web Components allow you to create new types of DOM elements, the DOM tree is very different from other implementations.
• The template, styling, and behavior are fully encapsulated in each custom element. Instead of having an overall stylesheet (base.css or app.css), each element that needs styling has its own stylesheet.
• Non-visual elements such as the router and the model are also implemented as custom elements and appear in the DOM. Implementing them as custom elements instead of plain objects allows you to take advantage of Polymer data binding and event handling throughout the app.

Compatibility

Polymer and its polyfills are intended to work in the latest version of evergreen browsers. IE9 is not supported. Please refer to Browser Compatibility for more details.

Running this sample

1. Install node.js (required for bower client-side package management)

2. Install bower: npm install -g bower

3. From the todomvc\ folder, run bower update

4. Start a web server in the todomvc\ folder. Hint: if you have python installed, you can just run:

   python -m SimpleHTTPServer

5. Browse to the server root