Building a mobile web app on Node-RED

Having adopted Node-RED (NR) as our control and integration platform. I’m now porting all our pure node solutions to NR. One thing we need is a mobile web app to configure, monitor and control Things.  You can do a lot out of the box with Node-RED but it isn’t obvious how to build a web app.  Fortunately for me Dave CJ one the Node-RED developers sent me a flow template to get me going.Below is the Node-RED IDE and mobile web app running in an emulator on

The web app is served via a HTTP: [Request]–[Template]–[Response] flow at the top of the work-space. The Template node contains single page web app built using  jquerymobile and highcharts. Once the web app is loaded into the browser all communications is done via web sockets.

In the example flow all actions on the web app are passed back to an UI dispatch Javascript function which handlers events like turn on a light using EnOcean wireless or operate a PI Face relay. [Webscoket in]–[UI dispatcher]–[your devices].

Having to move to NR has provided the opportunity to simplify the way web app communicates with the server. The solutions uses a simple JSON format using the HTML ID of the widget being updated or being clicked on along with a value. All communication is over SSL/TLS NR supports Basic Authentication but most mobile browsers won’t save passwords or support passing credentials via the URL. So we are thinking best how we implement user authentication.

Node-RED IDE and mobile web app via

Example flow

I’ve built an example flow which Node-REDers can use to build their own solutions. However there is some very basic documentation on the Git page! But the flow should be easy to follow for someone with a bit NR experience.

A quick demo video

Sorry not the best of quality movie maker was groaning a wee bit..

Using Node-RED to Integrate KNX & EnOcean

I spotted Node-RED late last year and “thought that looks good”. Now I’ve had time to work with it, it’s good, very good. Node-RED (NR) is an open source platform for developing control and integration solutions. It’s developed by IBM’s Emerging Technology team in the UK.

For those used to working with a visual “Function Block” style of programming you will feel immediately at home. NR caters for all, from the Citizen Developer to the harden node.js programmer. As someone who sit’s between these two end points working with NR is a joy. You develop a solution by linking nodes together to form a flow. Node-RED supports the creation of functions which allows you to develop custom control strategies or business logic.

There is a growing community of contributes who are adding features and interfaces to a wide range of Things, protocols and web services. There are two ways to extend NR, develop Node-RED nodes which requires programmer level skills and functions which is for anyone who can do a little JavaScript. Having learnt a bit of node.js by developing both an EnOcean and KNX interface it was quite straight forward to port these to NR.

Hardware – Server

I’m running Node-RED server on a Raspberry PI talking to the Weinzierle KNX BAOS web services gateway & EnOcean USB 300 gateway. So what I now have is a very powerful control and integration platform that costs only £50 quid.

IDE – Editor

Below are a few screen shots of the IDE (Editor) which runs in a web browser. It’s very easy to use but still powerful. You get a debug window and a nice highlighter to show what node wrote to the log along with connection status of communicating nodes. Once editing is complete hitting the deploy button sends the flows to the NR server where they are compiled and the server re-started, this only take a few seconds! You can have multiple works spaces (canvases) so the project can be broken up into logical blocks.

KNX to EnOcean Flow

It only takes four nodes to receive and process a KNX telegram and then transmit an EnOcean wireless one. Processing is project specific and is achieved with some simple JavaScript running in a function node. Click on the image below and you can see the JavaScript code in the function node. node-red-knx-enocean-ui.

KNX to anything Flow

With NR you can talk to any IP device traditional AV devices support TCP or UDP and modern internet enabled devices use Http web services. There are nodes for Sending SMS, Email getting weather data from the cloud and logging to a local or remote database. And when needed you can use good old serial. What’s more add an I/O board to the Raspberry PI and you can monitor the temperature in the KNX panel and cycle the bus power supply from a txt message! node-red-knx-anything

KNX to Flow

Pushover is great service and App it allows you to send push notifications to iOS and Android phones no monthly fee just one off App purchase of about £3. Adding pushover to my flow took less then two minuets. It’s a great way to get alerts if there issues with an installation or an annoying event keeps happening and you want to know before the customer is on the phone giving out to you! node-red-knx-pushover