Sign In

How It Works

SensorDash leverages a modern IoT stack to deliver real-time sensor data from your devices to your dashboard.

ESP32/ESP8266 Sensor

IoT devices equipped with temperature and humidity sensors collect environmental data. These ESP devices run custom firmware that reads sensor values at configurable intervals, processes the raw data, and prepares it for transmission.

MQTT Broker

The ESP devices publish data to specific topics on an MQTT broker (like Mosquitto). The broker acts as a message bus, receiving published messages from sensors and making them available to subscribed clients. This publish-subscribe model enables efficient, real-time data distribution.

Backend Server

A Node.js backend server subscribes to relevant MQTT topics and processes incoming data. It validates, enriches, and transforms the data before establishing WebSocket connections to stream the processed information to connected clients.

Frontend Dashboard

The React-based frontend connects to the WebSocket server to receive real-time updates. It processes and visualizes the incoming data stream, updating the dashboard dynamically without page refreshes.

Technical Details

ESP Device Configuration

ESP devices are programmed with Arduino or ESP-IDF frameworks to connect to your WiFi network, read sensor data, and publish to MQTT topics at configurable intervals.

MQTT Topics Structure

Data is published to topics like sensordash/devices/{device_id}/temperature and sensordash/devices/{device_id}/humidity.

Backend Processing

The Node.js backend uses libraries like mqtt to subscribe to topics and ws for WebSocket connections. Data is timestamped and formatted before being sent to the frontend.

Frontend WebSocket Connection

The React frontend establishes WebSocket connections to receive real-time updates, handling data parsing, state management, and rendering the dashboard components.