diff --git a/source/developers/frontend.markdown b/source/developers/frontend.markdown index 998c856542a..41953ac381c 100755 --- a/source/developers/frontend.markdown +++ b/source/developers/frontend.markdown @@ -9,7 +9,7 @@ sharing: true footer: true --- -Home Assistant is built on top of the [Polymer](https://www.polymer-project.org/) webcomponents framework. Polymer allows building encapsulated custom HTML elements. [Home-Assistant-Polymer source code on GitHub.](https://github.com/home-assistant/home-assistant-polymer) +Home Assistant is built on top of the [Polymer](https://www.polymer-project.org/) webcomponents framework. Polymer allows building encapsulated custom HTML elements. [Home-Assistant-Polymer source code on GitHub.][hass-polymer]
Do not use development mode in production. Home Assistant uses aggressive caching to improve the mobile experience. This is disabled during development so that you do not have to restart the server in between changes. @@ -17,70 +17,81 @@ Do not use development mode in production. Home Assistant uses aggressive cachin ## {% linkable_title Setting up the environment %} -Home Assistant will by default serve the compiled version of the frontend. As everything is compiled into the file `frontend.html` you do not want to work with the compiled version but with the separate files during development. To enable development mode for Home Assistant, update your `configuration.yaml` to have these lines: +
+All commands below need to be run from inside the home-assistant-polymer repository. +
+ +Home Assistant will by default serve the compiled version of the frontend from the hass_frontend Python package. For development you want to work with the unbundled source files which are in the home-assistant-polymer repository. + +First step is to configure Home Assistant to use the development mode for the frontend. Do this by updating the frontend config in your `configuration.yaml` and set the path to the polymer repo: ```yaml -http: - development: 1 +frontend: + development_repo: ../home-assistant-polymer ``` -Node.js is required to setup the frontend development environment. The preferred method of installing node.js is [nvm](https://github.com/creationix/nvm). Install nvm using the instructions in the [README](https://github.com/creationix/nvm#install-script), and install the correct node.js by running the following command from the `home-assistant` directory: +Next step is to git clone the [home-assistant-polymer repository][hass-polymer]. You can place the repository anywhere on your system but to keep these instructions simple we're cloning the home-assistant-polymer repository as a sibling to the Home Assistant repo. ```bash -$ git submodule update --init -$ nvm install $(