ESP32 OLED Weather Station with Real-Time Forecast.

Build a sleek and modern weather station using an ESP32 board with a built-in 0.96″ OLED screen. This project fetches live weather data and 3-day forecasts from OpenWeatherMap and displays it in a stylish sliding UI, complete with icons, temperature, weather description, and date/time. It’s an ideal IoT project to demonstrate API integration, Wi-Fi networking, and display handling.

Materials for the Project

1.  1x ESP32 Board Thingspark With built-in 0.96″ OLED (I2C)
2. 1x Micro USB Cable For programming and power
3. 1x Wi-Fi Network 2.4GHz for ESP32 connection
4. 1x Computer with Arduino IDE IDE version 1.8.19 or later

Step-by-Step Guide.

Download the Arduino IDE software from its official site. Here is a step-by-step guide on “How to install Arduino IDE“.

(2) ESP32 in Arduino IDE.

There’s an add-on that allows you to program the ESP32 using the Arduino IDE. Here is a step-by-step guide on “How to Install ESP32 on Arduino IDE“.

(3) Register OpenWeatherMap and get API key

1. Sign up for a new OpenWeatherMap account:

https://home.openweathermap.org/users/sign_up

  2. Get OpenWeatherMap API keys for “Project 1: Weather Station.”

https://home.openweathermap.org/users/sign_in

(4) Download Code File.

Download the code files from the link given below. Locate the “WeatherStation” Tab.
Replace the “********” in the WiFi_Name with your WiFi name. Replace the “********” in the WiFi_Password with your WiFi password.

Download code

(4) Update OpenWeatherMap API Keys.

Locate “WeatherStation” tab, and Replace the “******” in the OPEN_WEATHER_MAP_APP_ID with your
OpenWeatherMap API keys, which you registered in the previous preparations.

(5) Wiring/Connections

What the Code Does

Key Features:

• Connects ESP32 to your Wi-Fi network
• Uses NTP to get accurate date & time
• Fetches current weather and a 3-day forecast via OpenWeatherMap API
• Displays:
  • Temperature with icons (sun, cloud, rain, etc.)
  • Weather description (e.g., “clear sky”)
  • Day/date and time
• Automatically updates every 20 minutes

How the UI Works:

• Uses the OLEDDisplayUilibrary to create a sliding frame animation
• Frames:
  • Date & Time
  • Current Weather
  • 3-Day Forecast
• The overlay at the bottom shows:
  • Clock on the left
  • Temperature on the right

Essential Code Behavior

WiFi connection:

WiFi.begin(WiFi_Name, WiFi_Password); Time sync via NTP:

configTime(TZ_SEC, DST_SEC, "pool.ntp.org"); API requests (OpenWeatherMap):

currentWeatherClient.updateCurrentById(...);
forecastClient.updateForecastsById(...); UI management:

ui.setFrames(frames, numberOfFrames);
ui.setOverlays(overlays, numberOfOverlays);
ui.init(); Weather update every 20 minutes:

if (millis() - timeSinceLastWUpdate > (1000L*UPDATE_INTERVAL_SECS)) {
  setReadyForWeatherUpdate();
}

This project is a beautiful blend of IoT, graphics, and real-time data. It’s perfect for a home dashboard, IoT showcase, or classroom demo to teach weather APIs and embedded displays.