← Back to HomeBook a Free Consultation

Hardware-to-web case study

How I Built a Real-Time Water Level Monitor with ESP32 and a Live Web Dashboard

Most water incidents are not a surprise to the tank. They are a surprise to the people who only look at it twice a day. This project is a hardware-to-web monitoring system: an ESP32 node reads ultrasonic water level and leak signals, firmware sends the data upstream, and a web dashboard shows live status plus alerts. The point is not a demo board on a bench. The point is that an operations team can see tank level and leak risk in the browser, without a site walk.

The Challenge

  • Staff walked to tanks or pits on a schedule — or when something had already overflowed.
  • There was no shared, timestamped record of level, so “it looked fine this morning” was the audit trail.
  • Leak or overflow risk showed up as a physical mess, not as a notification.
  • Hardware vendors could ship a sensor and web vendors could ship a chart. Almost nobody owned both, so the data never became a product the team actually opened.

The Solution & Architecture

I designed the stack as one delivery loop — device, firmware, software, and UI — not three unrelated freelance jobs. Firmware is written so the dashboard is not guessing; it receives structured, debounced events.

  1. 01

    Device (field)

    ESP32 plus ultrasonic ranging for water level, with leak detection in the same node so operations see how full and whether it is escaping together.

  2. 02

    Firmware

    C++ on PlatformIO: sampling, filtering noisy ultrasonic readings, thresholds, and a reliable publish path with reproducible builds.

  3. 03

    Software (ingest)

    Readings land in a backend that stores history, evaluates alert rules, and exposes an API the UI can trust — a source of truth, not a spreadsheet dump.

  4. 04

    Web dashboard

    A browser UI for live level, trends, and alerts. Role-friendly and remote-accessible so a manager and a technician see the same numbers.

The Tech Stack

  • ESP32

    Wi-Fi-capable MCU with headroom for sensing, local logic, and network publish — practical for remote installs.

  • Ultrasonic level sensing

    Non-contact ranging for tanks where a float switch would only give a binary full/empty.

  • C++ / PlatformIO

    Production firmware workflow: versioned source, libraries, and repeatable builds instead of a one-off sketch.

  • Backend API

    Time-series storage and alert state so the UI is not talking to the MCU on every page load.

  • Web dashboard

    Live charts and status for teams who work in the browser, in any timezone.

  • Alert path

    Thresholds on level and leak so people are interrupted before overflow, not after.

The Results

  • • Manual tank rounds are no longer the primary control loop. Level is continuous, not last-walk.
  • • Leak and overflow risk become notifications, not discoveries on the floor.
  • • Operations get one dashboard — the same numbers on site and remote.
  • • The engagement is a product slice you can demo and extend (more tanks, email alerts, roles), not a prototype that dies when the USB cable is unplugged.

Business value in one line: fewer surprises, faster response, and a single place to look.

Build a similar system

If you need the same loop for tanks, solar batteries, cold rooms, or any sensor that should end in a real web app — not a serial monitor — book a free consultation. I build the hardware, the software, and the dashboard as one system, remote, in English, invoiced in USD.

Book a Free Consultation