Image of eBits Academy airquality illustration

Hosting a Simple Web Server on ESP32 - Air Quality Monitoring Station Series, Episode 15

  • April 15, 2025
  • |
  • Teofil Corad

Lesson objectives

The goal of this lesson is to introduce you to networking concepts related to IoT. When you finish this lesson, you will understand the importance of network connectivity in IoT devices and have established a WiFi connection.

Introduction

In this lesson, we dive deeper into the world of IoT by learning how to connect the ESP32 microcontroller to a WiFi network. One of the most important features of IoT devices is their ability to send and receive data over the internet, enabling remote monitoring, control, and data analysis.

Establishing a WiFi connection is the first step toward letting your IoT device interact with the outside world. It allows your ESP32 to send sensor data to cloud platforms, trigger alarms, or even host web servers that you can access through a browser on a device connected to the same network.


List of required components:

 


WiFi connectivity in IoT

WiFi connectivity is an important feature in many IoT devices, as it enables wireless communication over long distances without physical connections. By connecting your ESP32 to a local WiFi network, your device can:

  • Communicate with web servers.

  • Send data to cloud services.

  • Receive commands remotely.

  • Display real-time data on web pages.

These are exactly the capabilities that make IoT so powerful — allowing remote monitoring, device control, and automation.


Step 1: Preparing to establish a WiFi connection

Before we get to the code, have the following ready:

  1. Network details: You need the SSID (network name) and password for your WiFi network. Make sure you have access to a stable network with an internet connection.

  2. Updated libraries: Make sure your Arduino IDE is up to date and the library WiFi.h is included (it comes with the ESP32 by default). This library is required to connect to WiFi.


Step 2: Connect ESP32 to WiFi — code explanation

Thanks to the built-in WiFi.h library, connecting the ESP32 to WiFi is relatively easy. Let's look at the basic structure of the code:

#include <WiFi.h>

// Indsæt dine netværksoplysninger
const char* ssid = "Your_SSID"; // Dit netværksnavn
const char* password = "Your_Password"; // Dit netværkskodeord

void setup() {
  Serial.begin(115200); // Start seriel kommunikation
  delay(100);

  // Forbind til WiFi
  WiFi.begin(ssid, password);
  Serial.print("Forbinder til WiFi");

  // Vent til der er forbindelse
  while (WiFi.status() != WL_CONNECTED) {
    delay(1000);
    Serial.print(".");
  }

  // Udskriv IP-adresse når der er forbindelse
  Serial.println();
  Serial.println("Forbundet til WiFi!");
  Serial.print("IP-adresse: ");
  Serial.println(WiFi.localIP());
}

void loop() {
  // Her kan du lave ekstra funktioner mens der er WiFi-forbindelse
}

 


Code explanation


Library: The WiFi.h library provides access to WiFi connection functions.

Network details: ssid and password contain your network name and password. Replace "Your_SSID" and "Your_Password" with your own details.

WiFi connection: WiFi.begin(ssid, password) starts the connection.

Connection loop: while (WiFi.status() != WL_CONNECTED) checks the connection and keeps going until connected.

IP address: Once connected, the ESP32 IP address is displayed via WiFi.localIP().


Step 3: Test the connection

To make sure your ESP32 is connected correctly, follow these steps:

  1. Upload the code to the ESP32 via Arduino IDE.

  2. Open the Serial Monitor (Ctrl + Shift + M or under Tools > Serial Monitor) in Arduino IDE. Set the baud rate to 115200.

  3. Watch the output: you will see dots each time the ESP32 attempts to connect. Once connected, it will display "Connected to WiFi!" and the IP address.


Troubleshooting tips

  • Incorrect details: Check the SSID and password for typos.

  • Poor signal: Make sure the ESP32 is within range of the network.

  • Network security: Some networks do not allow new devices. Try another network if necessary or contact the network administrator.


Step 4: What happens once the connection is established?

Once connected, the ESP32 becomes part of your local network. This lets it communicate with other devices on the network, send data to the cloud, or host web servers.


Conclusion

In this lesson, we covered the basics of WiFi connectivity in IoT devices and connected the ESP32 to a local network. This is an important step in all IoT projects, as it enables communication with the internet and other network-connected devices.

By mastering WiFi connectivity, you have unlocked a powerful ESP32 feature that opens up remote monitoring, data transfer, and interactive web applications. Great work!

About the measurements: The station in this series measures temperature and relative humidity using the AHT10. These are indoor climate readings, not direct measurements of CO2, VOCs, or particles. The series name “air quality monitoring” should be understood with this limitation.

Step 5: Start your first web server

Replace your sketch with this complete example and enter your own network name and password. WebServer is included with the Arduino core for ESP32. The WiFi section repeats the setup above; server.on() associates the home page with a response, server.begin() starts the server, and server.handleClient() must be called continuously.

#include <WiFi.h>
#include <WebServer.h>

const char* ssid = "Your_SSID";
const char* password = "Your_Password";
WebServer server(80);

void setup() {
  Serial.begin(115200);
  WiFi.mode(WIFI_STA);
  WiFi.begin(ssid, password);
  while (WiFi.status() != WL_CONNECTED) {
    delay(500);
    Serial.print(".");
  }
  Serial.println();
  Serial.println(WiFi.localIP());
  server.on("/", []() {
    server.send(200, "text/html; charset=utf-8",
                "<!doctype html><html><body><h1>Hello from ESP32!</h1></body></html>");
  });
  server.begin();
}

void loop() {
  server.handleClient();
  delay(2);
}

Upload, open the Serial Monitor at 115200 baud, and find the IP address. Open http:// followed by the displayed IP address in a browser on the same local network, for example http://192.168.1.50/. The page should show “Hello from ESP32!”. Internet access is not required for this local test. If the page does not open, check the network, IP address, and any client isolation on guest networks.

This simple HTTP example has no login or encryption and is intended for your local test network. Do not forward its port to the internet. In episode 16, we replace the fixed greeting with temperature and humidity data.

API checked against Espressif’s official HelloServer example.

Leave a comment

Please note, comments need to be approved before they are published.