React on an ESP32

This sample project demonstrates how to run a React application on an ESP32 micro-controller. You can view the recording here

Software prerequisites

You will need to install

• node v14 or later
• The ESP-IDF. You can follow these instructions

Hardware to run demo

• an esp32 dev board such as this one from AliExpress or this one form Amazon
• A button
• A small servo motor like this one
• A magnet

instructions

If you are unfamiliar with running IDF commands please visit the Learn ESP32 and follow the first few free modules

1. clone the repo git clone
2. open ./main/main.c at the top of the file, set your WiFi SSID and passphrase by changing these lines

static const char *SSID = "MY WIFI SSID";
static const char *PASS = "MY WIFI PASS";

⚠️warning: Both SSID and passphrase are case sensitive

2. build the React application

cd site
npm run build

3. (optional) run the web dev server

npm run dev

4. Open an IDF shell to ensure your IDF environment is loaded and then in the project root run

idf.py flash monitor

5. make sure your PC is on the same WiFi that you are using
6. in your browser navigate to http://my-esp32.local
7. (optional) If you are running a dev server you can also navigate to http://localhost:3000