Delivery across Bangladesh Parts for your next idea For makers across Bangladesh Here to help Contact support
Illustrated weather display project
IOT PROJECT

Build a Wi-Fi Weather Station with ESP32

Measure temperature and humidity, display readings on an OLED screen, and view them in a browser on your local network.

Beginner to Intermediate
DifficultyBeginner to Intermediate
Estimated Time2–3 Hours
Skills LearnedSensors, I²C & Wi-Fi

1Project Overview

Build a small connected weather station using a classic ESP32 development board, a DHT22 temperature and humidity sensor, and a 128×64 SSD1306 OLED display. The sample also serves readings to devices on the same Wi-Fi network.

The illustration introduces the project concept. This starter measures temperature and humidity; use the connections and code below to build it.

2What You’ll Build

Concept illustration of a weather display project
  • Read temperature and humidity with a DHT22.
  • Display readings on an I²C OLED screen.
  • Serve readings through a simple local web page.
  • Practice checking wiring and testing individual modules.

3Components Required

Quantity: 1

Quantity: 1

Quantity: 1

The example also needs a DHT22 sensor and a compatible OLED display, which must be sourced and verified separately. Also use a suitable USB data cable. A bare DHT22 needs a data pull-up resistor; some breakout modules already include one. Verify your exact module before wiring.

4Connections

Example connections for a classic ESP32 board. Confirm your board pinout and module labels with power disconnected.

PartSignalESP32 Connection
OLEDVCC / GND3.3 V / GND
OLEDSDA / SCLGPIO 21 / GPIO 22
DHT22VCC / GND3.3 V / GND
DHT22DATAGPIO 4
Bare DHT22Data pull-up4.7–10 kΩ between DATA and 3.3 V

Module pin order can differ. Match the printed labels and datasheet; do not infer the pin order from an illustration.

5Step-by-Step Instructions

Set Up the Hardware

Connect the sensor and OLED using the table above. Check power and ground.

Install Required Libraries

Install the ESP32 board package, DHT sensor library, Adafruit Unified Sensor, Adafruit GFX and Adafruit SSD1306 through Arduino IDE.

Upload the Code

Select your board and port. Set your Wi-Fi credentials and upload the sample.

Test Sensor Readings

Open Serial Monitor at 115200 baud. Check readings and the displayed network address.

View Data Online

Open the printed local IP address from a device on the same Wi-Fi network.

Make It Yours

Add an enclosure, labels or additional sensors once the starter works.

6Arduino Code (Example)

Arduino Code (Example)
#include <WiFi.h>
#include <WebServer.h>
#include <Wire.h>
#include <DHT.h>
#include <Adafruit_GFX.h>
#include <Adafruit_SSD1306.h>

// Example for a classic ESP32 development board.
// Confirm the pinout and OLED address for your hardware.
const char* ssid = "YOUR_WIFI_SSID";
const char* password = "YOUR_WIFI_PASSWORD";
DHT dht(4, DHT22);
Adafruit_SSD1306 display(128, 64, &Wire, -1);
WebServer server(80);
float temperature = NAN, humidity = NAN;
unsigned long lastRead = 0;
bool oledReady = false;

void setup() {
  Serial.begin(115200);
  dht.begin();
  Wire.begin(21, 22);
  oledReady = display.begin(SSD1306_SWITCHCAPVCC, 0x3C);
  if (!oledReady) Serial.println("OLED not found; check wiring/address.");
  WiFi.begin(ssid, password);
  unsigned long started = millis();
  while (WiFi.status() != WL_CONNECTED && millis() - started < 20000) {
    delay(250);
  }
  if (WiFi.status() == WL_CONNECTED) Serial.println(WiFi.localIP());
  else Serial.println("Wi-Fi not connected. Sensor readings still available.");
  server.on("/", []() {
    if (isnan(temperature) || isnan(humidity)) {
      server.send(503, "text/plain", "Waiting for a valid sensor reading.");
      return;
    }
    String body = "<!doctype html><meta name='viewport' content='width=device-width'>";
    body += "<meta http-equiv='refresh' content='5'><title>ElectroShelf Weather</title>";
    body += "<h1>My ESP32 Weather Station</h1><p>Temperature: ";
    body += String(temperature, 1) + " C</p><p>Humidity: ";
    body += String(humidity, 1) + " %</p>";
    server.send(200, "text/html", body);
  });
  server.begin();
}

void loop() {
  server.handleClient();
  if (millis() - lastRead < 2500) return;
  lastRead = millis();
  temperature = dht.readTemperature();
  humidity = dht.readHumidity();
  if (isnan(temperature) || isnan(humidity)) {
    Serial.println("Sensor read failed; check wiring and pull-up resistor.");
    return;
  }
  Serial.printf("Temperature: %.1f C, Humidity: %.1f %%\n", temperature, humidity);
  if (!oledReady) return;
  display.clearDisplay();
  display.setTextSize(1);
  display.setTextColor(SSD1306_WHITE);
  display.setCursor(0, 0);
  display.println("ElectroShelf Weather");
  display.printf("Temp: %.1f C\n", temperature);
  display.printf("Humidity: %.1f %%\n", humidity);
  display.println(WiFi.status() == WL_CONNECTED ? WiFi.localIP().toString() : "Wi-Fi offline");
  display.display();
}

Download code

7Final Result

Concept illustration of a connected weather station

Your OLED and local web page should show temperature and humidity after a valid sensor reading. The web page refreshes every five seconds.

8Troubleshooting Tips

OLED blank? Check power, SDA/SCL and the module’s I²C address. Invalid sensor readings? Check pin labels, data wiring and the pull-up resistor. Wi-Fi offline? Check your network credentials and watch Serial Monitor.

Join the ElectroShelf Maker Community

Get to know your components, compare options and learn what each part does.

Explore Maker Guides