Polymer: Simplify Travis builds with webcomponents.org

The webcomponents.org catalog obsoletes the creation of Github pages for Polymer documentation and demos.

Polymer makes creating reusable elements a piece of cake. In fact, its modular nature enabled us to open source many of our generic elements on Github. Best of all, Polymer provides many helpers to automatically generate decent documentation and demos, thereby making the elements consumable for colleagues and the wider community.

Yet, one part of building open source Polymer elements used to be a real pain: the required scripting to create the Github pages for documentation and demos (see this blog post).

Good news: The webcomponents.org catalog obsoletes this step! After publishing an element to the catalog, it creates an element showcase page with the documentation and the demo. On top of it, the showcase page offers inline demoing: Users can edit demo code within the page, and directly see how the element behaves!

All you need to do is adding the following code to your README.md file on Github:

<!--
```
<custom-element-demo>
  <template>
    <link rel="import" href="my-element.html">
    <next-code-block></next-code-block>
  </template>
</custom-element-demo>
```
-->
```html
<my-element></my-element>
```

And as you’re on the README.md, you might also add the badge to let users find the showcase page:

[![Published on webcomponents.org](https://img.shields.io/badge/webcomponents.org-published-blue.svg)](https://www.webcomponents.org/element/owner/my-element)

Happy coding!

Want to learn more about Polymer? Have a look to all our Medium posts on Polymer.

Photo: Screenshot of webcomponents.org