home-assistant.io/source/_cookbook/custom_panel_using_react.markdown
2016-08-12 08:29:07 +02:00

1.2 KiB

layout, title, description, date, sidebar, comments, sharing, footer, ha_category
layout title description date sidebar comments sharing footer ha_category
page Custom Panel using React 2016-07-29 12:00 true false true true Custom Panel Examples

This is a React implementation of TodoMVC but instead of checking off to do items, you are turning lights and switches on/off.

  • It uses React to render the data.
  • It hooks into Home Assistant JS which means updates pushed from the server are instantly rendered.
  • It accesses properties made available from Polymer.
  • It uses the user configuration for the component in the configuration.yaml file for rendering.
  • It allows toggling the sidebar.

All you need is available as a custom component.

Create a entry for the panel in your configuration.yaml file to enable it. Set a title if you like.

react_panel:
  title: 'React'

This video shows the example in action.