Watch ESP32's GPIO status in real-time in a web browser

GPIOViewer is an open-source Arduino library allowing users to monitor the GPIO pins status of their ESP32 board in real-time in a web browser for troubleshooting or fun.

It’s different than the Wokwi ESP32 simulator that works entirely in a web browser since the GPIOViewer library sends GPIO status data of the actual hardware over WiFi to display the pin status as they change in a page rendered in a web browser from a choice of popular ESP32 development boards.

The GPIOViewer library relies on the ESPAsyncWebServer Async web server for ESP8266 and ESP32 and the AsyncTCP asynchronous TCP library for ESP32 microcontrollers. The first two must be manually downloaded and installed, and the latter can be installed directly from the Arduino IDE’s Library Manager by searching for it.

GPIOViewer has a 50 KB footprint, works with digital, analog, and PWM, and supports various ESP32-VROOM-32 development boards, Olimex ESP32-EVB and ESP32-POE boards, Lolin ESP32-C3 Mini, Arduino Nano ESP32, Seeed Studio XIAO-ESP32-C3, and others.

What’s really impressive is that you only need to add a few lines of code to enable GPIO monitoring in your existing Arduino sketch:

#include <gpio_viewer.h> // Must me the first include in your project
GPIOViewer gpio_viewer;

void setup()
{
  Serial.begin(115200);

  // Comment the next line, If your code aleady include connection to Wifi
  gpio_viewer.connectToWifi("Your SSID network", "Your WiFi Password");
  // gpio_viewer.setPort(5555);   // You can set the http port, if not set default port is 8080

  // Your own setup code start here

  // Must be at the end of your setup
  // gpio_viewer.setSamplingInterval(25); // You can set the sampling interval in ms, if not set default is 100ms
  gpio_viewer.begin();
}

#include <gpio_viewer.h> // Must me the first include in your project

GPIOViewer gpio_viewer;

void setup()

{

Serial.begin(115200);

// Comment the next line, If your code aleady include connection to Wifi

gpio_viewer.connectToWifi("Your SSID network", "Your WiFi Password");

// gpio_viewer.setPort(5555); // You can set the http port, if not set default port is 8080

// Your own setup code start here

// Must be at the end of your setup

// gpio_viewer.setSamplingInterval(25); // You can set the sampling interval in ms, if not set default is 100ms

gpio_viewer.begin();

}

Build and flash the code to your board, and run it. A URL will show up in the serial console similar to http://192.168.1.111:5555. Enter this URL in a web browser and watch the GPIO pins status update in near real-time as you can see in the video demo. (embedding has been disabled so I can’t include it in the post).

Via Hackaday.

Jean-Luc Aufranc (CNXSoft)

Jean-Luc started CNX Software in 2010 as a part-time endeavor, before quitting his job as a software engineering manager, and starting to write daily news, and reviews full time later in 2011.