jeena/home-assistant.github.io
1
0
Fork 0
Code Issues Pull requests Projects Packages Wiki Activity Actions

Merge remote-tracking branch 'origin/current' into next

Browse source
This commit is contained in:
Paulus Schoutsen 2017-03-09 21:44:12 -08:00
commit 194b8b8112
33 changed files with 330 additions and 105 deletions
Download patch file Download diff file Expand all files Collapse all files

13
source/developers/development_environment.markdown
View file

@ -39,22 +39,17 @@ Additional dependencies exist if you you plan to perform Frontend Development, p
If you plan on providing isolation to your environment using [`venv`](https://docs.python.org/3.4/library/venv.html). Within the `home-assistant` directory, create and activate your virtual environment.
If using Python < 3.6 `pyvenv` is the recommended method of setting up virtual environments, you'll need to install the `python3-venv` package.
```bash
$ sudo apt-get install python3-venv
$ pyvenv venv
$ source venv/bin/activate
```
If using Python 3.6 `pyvenv` has been deprecated:
```bash
$ python3 -m venv venv
$ source venv/bin/activate
```
Note, Debian does not ship a full Python3 package and so requires you to install `venv` manually `sudo apt-get install python3-venv`.
### {% linkable_title Setup and Run %}
* On Mac OS X and Linux (remember to activate your virtual environment before running setup, if you are using one):
* On Mac OS X and Linux:
```bash
$ cd home-assistant
$ script/setup

24
source/developers/frontend.markdown
View file

@ -9,12 +9,7 @@ sharing: true
footer: true
---
Home Assistant uses [Polymer](https://www.polymer-project.org/) for the UI and [NuclearJS](http://optimizely.github.io/nuclear-js/) for maintaining the app state.
* Polymer allows building encapsulated custom HTML elements.
[Home-Assistant-Polymer source code on GitHub.](https://github.com/home-assistant/home-assistant-polymer)
* NuclearJS is a reactive flux built with ImmutableJS data structures.
[Home-Assistant-JS source code on GitHub.](https://github.com/home-assistant/home-assistant-js)
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)
<p class='note warning'>
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.
@ -29,30 +24,33 @@ http:
development: 1
```
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 node.js by running the following command:
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-polymer` directory:
```bash
$ nvm install node
$ cd homeassistant/components/frontend/www_static/home-assistant-polymer
$ nvm install < .nvmrc
```
Next step is to get the frontend code. When you clone the Home Assistant repository, the frontend repository is not cloned by default. You can setup the frontend development environment by running:
[Yarn](https://yarnpkg.com/en/) is used as the package manager for node modules. [Install yarn using the instructions here.](https://yarnpkg.com/en/docs/install)
Next step is to get the frontend code. When you clone the Home Assistant repository, the frontend repository is not cloned by default. You can setup the frontend development environment by running from the `home-assistant` directory:
```bash
$ script/setup
$ script/bootstrap_frontend
```
## {% linkable_title Development %}
While you are developing, you need to have Rollup running to have your JavaScript changes be made available.
While you are developing, you need to have Rollup running to have changes you make to the JavaScript app-core made available.
```bash
$ cd homeassistant/components/frontend/www_static/home-assistant-polymer
$ npm run js_dev
```
The source code for the frontend can be found in three different directories:
The source code for the frontend can be found in two different directories:
- UI: `homeassistant/components/frontend/www_static/home-assistant-polymer/src/`
- Core: `homeassistant/components/frontend/www_static/home-assistant-polymer/home-assistant-js/src/`
- Panels: `homeassistant/components/frontend/www_static/home-assistant-polymer/panels/`
# {% linkable_title Building the Polymer frontend %}