A recipe for building a Web UI using MQTT for your IoT / Embedded App

Cook up a simple & tasty web UI for your embedded project with just a few simple ingredients!  Served on a bed of wholesome Linux goodness on an SBC, (my favourites are: Raspbery Pi or Odroid N2 but substitute alternatives for your own taste) – this is sure to delight family and friends alike!

Ingredients

For the back-end you will need:

Your embedded App  – this is the centrepiece of your creation, it will do some magic and communicate with the UI via MQTT.

python3 – always handy for thickening the sauce!

Flask – tiny & easy to set-up python system for serving your UI’s web pages and static files, perhaps a little lighter on the palette than the ubiquitous Node.js?

Mosquito – for sending MQTT messages between your app and the web UI for updating status and sending commands, MQTT lends a more contemporary taste than the sometimes overused AJAX!

For the front-end you will need:

bootstrap – presentation is soo important!

paho-js – for communicating with MQTT.

HTML & Javascript – the prefect seasoning, no need for some of the heavier spices like Angular.

How To Cook

(details coming soon, hopefully!)

0 replies

Leave a Reply

Want to join the discussion?
Feel free to contribute!

Leave a Reply

Your email address will not be published. Required fields are marked *