Polymer is in alpha. So some of the code described in this article may or may nor work properly in your browser.
For more information on current polymer compatibility status check out http://www.polymer-project.org/resources/compatibility.html
What's all this then?
Polymer aims to solve this with web components. As the polymer website puts it:
"Web Components usher in a new era of web development based on encapsulated and interoperable custom elements that extend HTML itself. Built atop these new standards, Polymer makes it easier and faster to create anything from a button to a complete application across desktop, mobile, and beyond."
And i for one, welcome our new component overlords. The key phrase to take away from that description is "extend HTML". This is what for me as a developer who likes to focus on "making cool stuff fast" the key part of polymer. What it means is "everything is a tag".
While web components still rely on all those things, polymer puts it much further into the background. I marries the concepts of object oriented programming with HTML tags. Making it much easier to build, document, share and implement. But...
It's not THAT easy... yet
For some time now I've been watching the development of polymer from a distance. I would have liked to get closer sooner, but there where a few hurdles in the way.
Currently getting polymer to work is a bit tricky. The website gives instructions on how to get and install polymer in it's current state. However they assume that we all have access to some console that lets us install what ever we bloody like on the server.
Well... most of us don't. But a few days ago (as of writing this article) some examples and files were made available for download so that we, who can't just install bower on a whim, can hack together the pieces and upload the files in a more "traditional" way. So i managed to hack some things together using files from the polymer website and from git. And so far, it works... but it was not as easy as they said it would be. It will be, eventually.
So this is my first working test. At the bottom of this article you should see a google map. Of course having a google map implemented on a website is not a revolution, but how it is implemented IS.
The map on this page uses polymer. And with that the implementations is reduced to the following:
<link href="components/google-map/google-map.html" rel="import" />
This part imports all the code needed to make a "google-map tag"
<google-map fittomarkers> <google-map-marker draggable="false" icon="images/iroiro/marker_denmark.png" latitude="54.7520395" longitude="11.8904685" title="Where i live"></google-map-marker> <google-map-marker draggable="false" icon="images/iroiro/marker_japan.png" latitude="35.2973022" longitude="136.8695648" title="Where i want to live"></google-map-marker> </google-map>
This part is the map.. using a google-map tag. Something that does not exist in HTML... but now works as an extension to HTML. With custom markers and all.
This is a map. It's a big deal!!!
This is the future of the web. More importantly: It's the future of the web, put in the hands of those who make it.
There is a lot more to say about polymer and web components. And it is already being said by people who a much better at telling the real story than i am. And while i'm not smart enough to fully explain why this is important, i am smart enough to know: THIS IS REALLY IMPORTANT!
For more info visit : http://www.polymer-project.org/
… And watch these videos: