Hive monitor

Hive monitor is a frontend for displaying data from MQTT server receiving events from bee hives. The complementary project hivemonitor-ESP32-firmware reads sensor values and publishes on MQTT topic.

Complemetary hivemonitor repositories:

• Hive monitor ESP32 Firmware
• Hive monitor ESP32 PCB design

Preview

Preview site

Requirements

This sveltekit project requires Node.js and yarn installed:

• node.js
• yarn

Page requires data from MQTT topic, use a public or locally hosted MQTT broker:

• Connect to public broker
• Setup and connect to self hosted broker

Config

Set PUBLIC_MQTT_BROKER_WS_URL environment variable for MQTT broker. Since browsers don't support MQTT natively we want to connect to MQTT over WebSockets for events.

cp .env.example .env

# edit .env in favorite text editor
# PUBLIC_MQTT_BROKER_WS_URL=ws://test.mosquitto.org

Run

Using docker:

docker run -d -p 8080:8080 --name hivemonitor ghcr.io/kevinmidboe/hivemonitor

Setup

Install

Clone repo, navigate into folder and install node dependencies:

git clone https://github.com/KevinMidboe/hivemonitor.git
cd hivemonitor
yarn

Development

Run development server using yarn dev command. Add --host flag for allowing connections for any device on same network.

Production

Build static files and serve them with your favorite webserver, or use included docker configuration.

Compile project into static files located at generated folder: ./build.

yarn build

Build and run using nginx in docker:

docker build -t hivemonitor .
docker run -p 8080:8080 --name hivemonitor-frontend hivemonitor

Example mqtt payloads

should automate generating interfaces or grpc.

telemetry/gateway/[id]:

{
	"gateway_name": "Elisabeth",
	"t": "2025-02-08 15:03:30",
	"temperature": "22",
	"battery_level": "20"
}

telemetry/hive/[id]:

{
	"hive_name": "Elisabeth",
	"t": "2025-02-08 15:03:30",
	"temperature": "22",
	"humidity": "30",
	"pressure": "30",
	"weight": "30",
	"battery_level": "20"
}