diff --git a/README.md b/README.md new file mode 100644 index 0000000000..6424a1a1fd --- /dev/null +++ b/README.md @@ -0,0 +1,45 @@ +# Home Assistant Polymer + +This is the repository for the official Home Assistant frontend. The frontend is built on top of the following technologies: + + * [Polymer](https://www.polymer-project.org/1.0/) + * [NuclearJS](http://optimizely.github.io/nuclear-js/) + * [ES2015 via Babel](http://babeljs.io/) + * [WebPack](http://webpack.github.io/) + * [Bower](https://bower.io) for Polymer package management + * [NPM](https://npmjs.com) for JavaScript package management + +[![Screenshot of the frontend](https://raw.githubusercontent.com/balloob/home-assistant-polymer/master/docs/screenshot.png)](https://home-assistant.io/demo/) + +## An unusual approach to Polymer + +As you might have noticed, we are using two different package managers. This might seem crazy but we have good reasons. Let us explain… + +One of the big advantages of webcomponents is that you can ship all your HTML resources in a single file: HTML-template, CSS and JavaScript. From your HTML template and JavaScript you are then able to embed extra webcomponents and use it to build a whole UI. + +![Structure webcomponents](https://raw.githubusercontent.com/balloob/home-assistant-polymer/master/docs/webcomponent-embed-js.png) + +Before the release of Polymer 0.8, you would define all parts of your webcomponent inside a ``. With the introduction of Polymer 0.8 the structure of a webcomponent has been split up into a `` for the CSS and HTML template and a `