Create a custom UI

This tutorial will walk you through the process of creating a basic web user interface based on the example of UI dedicated to control the relay module.

Prepare a coding environment

Although you don't need any specific tools for UI development, we strongly recommend using the Visual Studio Code to edit the code. There are some useful tools that can be helpful.

Download the Visual Studio Code

https://code.visualstudio.com/downloadcode.visualstudio.com

Clone the sample UI

The tutorial will present to you how to build the custom UI based on the project available on our GitHub repository. Please clon our repository to any folder on your computer and follow the descriptions.

git clone https://github.com/LeoRover/leo_ui_sample_relay.git

Configure the new project

Before you start a UI development, we recommend you to install the Live server extension. It will give the possibility of generating a UI preview.

Code descriptions

TODO