Introduction to Node Red and The Dashboard

node-red-iconWhat is Node Red? –Node red is a flow based tool and IOT Dashboard developed by IBM and written in Node.js.It is an Open Source project

Node red lets you easily create program flows by joining together black box functions using a web interface.

In this tutorial you will learn

  • How to install Node red on Windows and Linux
  • How to start Node-red.
  • How to Install the Node red Dashboard
  • How to create,rename,delete ,disable,export and import flows Flows.
  • How to create an IOT dashboard.

Installing Node Red

Before you Install node red you will need to install node.

Note: In response to a comment from Julian I have removed the instruction to update the package manager before installing.

Install node red using these instructions

Starting Node Red

To start node red on Windows go to a command prompt and type:

node c:\node\node_modules\nodered\red.js

Note: you may need to change into the node directory.

On Linux:

Firstly running node by typing node may not work as apparently node is a shortcut to nodejs and the shortcut may not be present.

running-node-fail

In addition there appears to be a naming conflict with another package. see this explanation

The screen shot show how to create the symbolic link

whereisnodejs

Now that node is working you can run node-red

Type node-red at the command prompt. If that doesn’t work it’s probable because the link isn’t configured as shown above. You can try the alternative.

nodejs /usr/local/bin/node-red

As shown below

running-node-red

At the bottom of the screen it tells you the url to use to access the node-red web interface to create your flows

node-red-web-url

This consoles stays open and you will find it useful as when you start creating flows you will see log information appearing there.

You can also start node-red using the

node-red-start

which starts node-red as daemon.

to stop it use:

node-red-stop

Connecting to The Admin Interface

To administer node web you will need to to the admin url which is 127.0.0.1:1880 if you are running the browser on the same machines as node-red.

I prefer to run node-red on a LInux machine and use a second machine to access it

node-red-browser

You should start with an empty work space as shown above.

Installing The Node-Red Dashboard

The node red dashboard is an add-on module that lets you create live dashboards and is optional but recommended.

Here are the install instructions and a brief description.

Important Notes:

  • On Linux you need to have created the link to node or the install fails.
  • You get a series of warnings at the end as shown belownodered-dashboard-install-warningsThe warnings are nothing to worry about.
  • You need to go to the ~/.node-red folder (Linux) to do the install otherwise when you open the node-red interface the dashboard icons will be missing.

The Node_red dashboard files are stored in a folder called node-red-dashboard in the node-modules folder.

node-red-dashboard-files

Using The Node Red Admin Interface

You should start with an empty work space as shown in the screen shot below.

The default view is a three column layout with nodes on the left ,the flows work space in the middle and a third column with three tabs( info, debug and dashboard) on the right.

node-red-screen.jpg

The nodes on the left are arranged in categories.

There is a input group, output group,functional nodes,dashboard or display nodes etc.

Here is a very good overview video.

Each node has a well defined function and contains its own data.

To add nodes to a flow drag them from the node palette on the left into the main workspace in the middle pane.

You can link the flows together by dragging a wire between them.

A collection of nodes in a workspace is called a flow.

 

The dashboard or display nodes appear on the User Interface (UI) dashboard.

To access this dashboard use the url – host:1800/ui or in my example: steve-laptop:1880/ui

An example UI dashboard is shown below:

node-red-ui

The layout of the UI screen can be controlled in the dashboard tab (third column main screen) .

node-red-dashboard column

Node Red Demo Videos

The following videos shows you how to use the web interface to create a basic flows.

In this video tutorial I use Node-red to subscribe to an MQTT broker and display messages on a topic.

This video follows on from the first and in it we create an MQTT dashboard to control and display two MQTT sensors as well as learning more about using node-red..

Renaming and Disabling Flows

I couldn’t find this setting but a reader pointed it out.

Open the flow go to the menu (top right) node-menu and select flows> rename flow. You can rename the flow and and there is a toggle to enable/disable it.

You need then to redeploy for the setting to take effect.

You can also access this setting by double clicking on the flow name tab:

disable-node-red-flow

Exporting Flows

You can export a flow to install on another system.To do this you need to highlight each node in the flow and then click on Menu>export>clipboard.

export-node-flow

The contents of the export file will be displayed click on export to clipboard.

node-export-to-clipboard

You then need to open a file editor and paste the contents into the file using CTRL+V. Give the file a name and save it.

Deleting a Flow

To delete the flow click menu select flow and delete.node-delete-flow

Importing a Flow

To import a flow you need to open it with a text editor and copy it then go to menu>import>clipboard

import-flow-node-redand paste in the flow.

Resources

Other Node-Red Tutorials

Related Tutorials

Please rate? And use Comments to let me know more
[Total: 8    Average: 4.5/5]

7 comments

  1. Hello. I’m not keen to join a Google group to post my newbie questions, and found your Oct 3 YT video with link here… First, I don’t have a smartphone (SP), and don’t see getting one any time soon. Seems the SP is all the rage with IoT/Home Automation – which directly leads to Node-Red/MQTT etc. I would consider getting a SP if it was ONLY for IoT/HA around my property (and not for any phone communication). Might you know if this is workable? If not, I’m guessing there’d be a way to use a hand-held sort of esp8266/esp32 to act in place of a SP – do you think that’s viable? Appreciated.

    1. If you are primarily interested in Home automation then Amazon echo devices are likely to become more popular than smart phone apps. I don’t use my smart phone very much and although currently most smart devices are designed to work with a smart phone/tablet I don’t think that is going to be the future.
      You can use any computer to interface with node red. I’m not that familiar with the esp devices but if they are like the Raspberry Pi then you should be OK.

      1. The ESP8266 & ESP32 are microprocessors and not single board computers (like the Pi). The are programmed at a low level, typically using C++. They are similar to the popular Arduino but have embedded Wi-Fi. As such they will not run Node.JS and so cannot run Node-RED.

        They are very commonly used in DIY home automation though because of their low cost. Also, they do have MQTT client libraries available (there is even an example MQTT broker library!) and so can publish data direct to a broker.

    2. Hi rjm, if you are into Slack, there is also a Node-RED Slack group. Node-RED uses Node.JS which will not run on the heavily constrained microprocessors you mention. However, you could use them to post direct to MQTT – there are direct MQTT mobile clients you could use to consume the data.

      However, the cost of a small single-board computer such as a Raspberry Pi is tiny and these are more than enough to run multiple services. For example, on my own HA setup I run Node-RED, Mosquitto, InfluxDB, Telegraf & Graphana easily on a single Pi 2. Node-RED can then be used to create Dashboards that will work on your SP.

  2. Hi Steve, you say that you need to update npm – this is incorrect and can be very damaging. You should use the version of npm that comes with the version of Node.JS you have installed. Other versions may not work in the same way and may cause issues with installed modules.

  3. Hello,
    You can disable the flow by going to Menu>Flows>Rename. In this window change the Status from Enabled to Disabled. This applies to a single flow.

Leave a Reply

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