XXXL_Embedded_C_STM32-Microcontroller__Web_React_App // 01.2021

Remote lighting control with a regulator / Web application / Encoder / RGB LED

I connected here a lot of technologies in one place:

... to show what I can create,

JavaScript                 React.js           STM32           C       GPIO     I2C      PWM  
NUCLEO-F746ZG              Web Serial API     Axios           Light intensity sensor BH1750
ES6                        CSS Modules        asynchronous components               Encoder     
CSS3                       HTML5              REST API                                  MVP
RGB LED                    Serial Port        ADC - Analog to Digital Converter      Timers
Automatic Regulator

How it works ? (12 Steps)

I want to show the most important details and possibilities of my project here :) (only 2 min)

---

1. Schematic diagram

---

---

---

2. Electrical diagrams of individual elements:

---

---

---

3. Whole STM32 chip with connected components:

---

---

---

4. The structure of the web application and data flow between components:

---

---

---

5. Operation of the application not connected to the serial port:

---

---

---

6. Connecting the application with the serial port:

---

---

---

7. System control from the web application through the serial port:

---

---

---

8. System control from the web application through the serial port (part 2):

---

---

---

9. Additional encoder control:

---

---

---

10. Remote control of the system:

---

---

---

11. Real-time display of measurements on a smartphone:

---

---

---

12. Real-time display of measurements on a smartphone (part 2):

---

---

---

(Configuration: Web Serial API)

chrome://flags/#enable-experimental-web-platform-features