Interface and Application Programming

During the Networking Week, I set up a XIAO ESP32C3 microcontroller board to conenct to a Wi-Fi network and set up a web server that listens on port 80 with the use of WiFi_REST_Lib. I defined "led" and "hue" endpoints. "Led" had parameters "on" and "off", which were turning an LED on and off. The "hue" endpoint had a "value" parameter, which was then mapped to red, green and blue values of the RGB LED.

This week I attempted to incorporate JavaScript, JQuery and Bootstrap based user interface for interacting with the endpoints defined in the Arduino sketch, sending HTTP requests to the endpoints and displaying the responses. I wanted to have a virtual buutton to replace the physical one on the board that would turn the LED on and off. I wanted to have also three sliders that would define the red_value, green_value and blue_value of the RGB LED. That way user could change the color on the physical board using a web browser.

Interactive interface preview

RGB LED Control

RGB LED Control

Solvespace UI

Solvespace UI

Group Assignment page