Building IoT Dashboards with Node-RED and MQTT

Introduction

Your Thread devices are now publishing sensor data to an MQTT broker. The next step is to visualize this data in real time. In this episode, we’ll use Node-RED to build a live dashboard. It will show data from Thread-based sensors like temperature or humidity.

What is Node-RED?

Node-RED is a low-code, flow-based development tool for wiring together hardware devices, APIs, and online services. It’s perfect for building dashboards quickly using MQTT data.

System Overview

  • STM32WB Thread Device → Sends data over CoAP to Border Router
  • Border Router → Publishes to MQTT Broker
  • Node-RED → Subscribes to MQTT topics and displays data

Installing Node-RED

On your Border Router (or separate Linux server), install Node-RED:


sudo npm install -g --unsafe-perm node-red
node-red

Access it via your browser: http://localhost:1880

Setting Up MQTT in Node-RED

1. Drag an MQTT IN node to the flow editor.
2. Configure the broker (e.g., mqtt://localhost:1883)
3. Set the topic to: thread/sensor/temp
4. Connect it to a gauge node from the Dashboard palette.

Creating a Simple Flow

Your basic flow will look like this:

[MQTT IN] → [Function Node (parse data)] → [Gauge (Dashboard)]

Example function node to parse raw CoAP payload:


msg.payload = parseFloat(msg.payload.trim());
return msg;

Dashboard Setup

  • Install the Dashboard module: node-red-dashboard
  • Access the UI at: http://localhost:1880/ui
  • Add graphs, charts, and widgets to show temperature trends over time

Expanding the Dashboard

You can extend the dashboard with:

  • Historical line charts for temperature
  • Toggle switches to send control commands (e.g., LED ON/OFF via MQTT)
  • Alerts when thresholds are crossed

Conclusion

With Node-RED and MQTT, you’ve built a responsive dashboard for your Thread network. This visual layer completes the IoT stack—from sensor to cloud to user interface. In the next episode, we’ll explore adding secure OTA (Over-the-Air) firmware updates for STM32WB in a Thread network.

Leave a comment