Let’s take a quick look at the most relevant parts of the HTML file. We’ll upload these files to the ESP32 filesystem (SPIFFS).Ĭopy the following to the index.html file. You should save the HTML, CSS, and JavaScript files inside a folder called datainside the Arduino sketch folder, as shown in the previous diagram. If you’re programming the ESP32 using PlatformIO, you should add the following lines to the platformio.ini file to include the libraries (also change the Serial Monitor speed to 115200): monitor_speed = 115200Īrduino-libraries/Arduino_JSON 0.1.0 Schematic Diagram Installing Libraries (VS Code + PlatformIO) zip Library and select the libraries you’ve just downloaded. Alternatively, in your Arduino IDE, you can go to Sketch> Include Library > Add. The ESPAsyncWebServer and AsynTCP libraries aren’t available to install through the Arduino Library Manager, so you need to copy the library files to the Arduino Installation Libraries folder. Go to Sketch > Include Library > Manage Libraries and search for the library name. You can install the first library using the Arduino Library Manager. Arduino_JSON library by Arduino version 0.1.0 (Arduino Library Manager).To build this project, you need to install the following libraries: ESP32 with VS Code and PlatformIO: Upload Files to Filesystem (SPIFFS).

If you’re using VS Code with the PlatformIO extension, read the following tutorial to learn how to upload files to the filesystem: ESP32: Install SPIFFS FileSystem Uploader Plugin in Arduino IDE.Follow the next tutorial to install the filesystem uploader plugin if you haven’t already: To upload the HTML, CSS, and JavaScript files needed to build this project to the ESP32 flash memory (SPIFFS), we’ll use a plugin for Arduino IDE: SPIFFS Filesystem uploader. Getting Started with VS Code and PlatformIO IDE for ESP32 and ESP8266 (Windows, Mac OS X, Linux Ubuntu).If you want to use VS Code with the PlatformIO extension, follow the next tutorial instead to learn how to program the ESP32: Installing ESP32 Board in Arduino IDE (Windows, Mac OS X, Linux).Follow the next tutorial if you haven’t already: So, you must have the ESP32 add-on installed. We’ll program the ESP32 using Arduino IDE. You can use the preceding links or go directly to /tools to find all the parts for your projects at the best price! You don’t need three LEDs to test this project, you can simply see the results in the Serial Monitor or use other actuators that required a PWM signal to operate. ESP32 Board – read ESP32 Development Boards Review and Comparison.Before proceeding with this tutorial, make sure you check all the following prerequisites.

Websocket file upload example