Extending the Arduino IoT Cloud with FRED

Augment an Arduino-based weather station with external service notifications using the FRED Cloud-hosted Node-RED service.

Introduction

In this tutorial we’ll show you how to augment the Arduino Cloud service using the FRED cloud-hosted Node-RED service for some simple data processing and notifications. This is a common use-case for FRED and Arduino Cloud. Arduino cloud offers a basic data gathering and dashboard facility, and FRED is used as a general purpose programming system to add value to the Arduino cloud.

Once you master this basic pattern – of offloading processing from Arduino to FRED, you can use it for a variety of use cases, such as:

  • Adding sophisticated cloud processing such as complex event management or cloud based machine learning to analyse your sensor data
  • Leveraging third party service via FREDs easy nodes – eg IBM Watson, GE’s Predix or external DB services such as InfluxDB
  • Gathering and combining data from multiple locations and sensors, combining with public data like traffic or weather and building complex, interactive dashboards.

For this tutorial, we’ll create a connected temperature and humidity sensor using an Arduino MKR WiFi 1010 connected to a DHT11 sensor.  We’ll also add an external LED to indicate when the temperature is too high or low.

We’ll show you how to connect this device to the Arduino cloud service, create a ‘Thing’ in the service that exposes several properties corresponding to the sensors and LED.   We can then use the arduino-cloud dashboard to interact with the device.

Finally, we show how we can develop a simple processing flow in Node-RED, that uses the arduino-cloud nodes available on the FRED service to connect to the “Thing” on the arduino cloud and do some simple data processing as well as send data to an external notification service.  For this tutorial we’ll use the PushBullet service.

An overview of the set up is shown below.

Figure 1. Using FRED Service for processing and integration with IoT Cloud

This tutorial will talk you through the 4 main steps:

  1. Setting up the Arduino Weather Station Prototype board
  2. Connecting to the Arduino IoT Cloud
  3. Developing the Node-RED flow on FRED
  4. Connecting to the Pushbullet external notification service

The Weather Station Prototype

The prototype weather station device we’ll use is shown in Figure 2.

Figure 2. Prototype weather station with DHT11 temperature and humidity sensor and LED indicator light.

For this prototype you’ll need the following:

  • Arduino MKR Wifi 1010 with USB cable to connect to your PC
  • breadboard and jumper cables
  • An LED
  • 220 ohm and 10K ohm resistors

You can wire up the device as shown in Figure 3.

Figure 3. Breadboard diagram of prototype weather station.
Figure 4. Schematic for weather station.


Testing the Device Using a Local Sketch

To ensure the device works, we’ll upload a test program into the device that reads from the sensors and blinks the LED every two seconds.  The test program in the Appendix Listing 1 blinks the LED, reads the DHT11 sensor and sends the current readings to the serial monitor output.  

To upload this sketch, you’ll need to install and run the arduino editor and connect the device to your Mac or PC using a USB cable.  While you can download and run the arduino IDE locally, for this tutorial, we’ll use the arduino web-editor.  To get started see the Getting Started with Web Editor tutorial.   

To use the web editor, you need to create an Arduino account.  (You’ll need to do this to use the arduino cloud service later anyway so now is a good time to get that done.)  Once you have an account, you need to install a browser plugin.  Finally ensure your Arduino board plugged into the USB port is recognized by the computer.

Before you can upload the test sketch, you’ll need to include the DHT Sensor Library.  To find it, click on the Library Manager button on the web editor, and then search for DHT as shown in Figure 5.  It will likely be near the top as shown.  Click on the star to make it available in your favourites so you can use it in your sketches.

Figure 5. Search for DHT Sensor Library using the Library Manager.

You can then copy it to your editor and upload it to your board to ensure the board is working.  Once this is done you should see the onboard LED blinking on the board every second.  

Click on the Monitor tab to see the following in the monitor:

Humidity: 34.00%  Temperature: 18.00°C 64.40°F  Heat index: 16.74°C 62.14°F
turn LED on
Humidity: 34.00%  Temperature: 18.00°C 64.40°F  Heat index: 16.74°C 62.14°F
turn LED off
Humidity: 34.00%  Temperature: 18.00°C 64.40°F  Heat index: 16.74°C 62.14°F
turn LED on
Humidity: 34.00%  Temperature: 18.00°C 64.40°F  Heat index: 16.74°C 62.14°F
turn LED off

If you have any issues, ensure the DHT11 and LED are connected correctly, ensuring the correct pins are connected, and the polarity of the LED is correct.  If all goes well, congratulations, you’ve just built a prototype weather station!

Connecting the Device to IoT Cloud

Next we’ll connect our device to the arduino cloud service. This involves the following steps:

  • Adding a “thing” to represent our device and its properties.
  • Connecting our device to the IoT Cloud platform.
  • Associating the physical device with the thing.  This causes some code to be generated to handle the thing properties.
  • Updating the code needed to keep the thing properties are kept in sync with the real world weather station device sensor values and state of the LED.

To get started with Arduino Cloud you can follow the Getting started with the Arduino IoT Cloud.

We’ll go through the steps with our specific device.

Adding a Thing

In the IoT Cloud click on Things, and then the Create Thing button.

Figure 6. Creating a Thing in the IoT Cloud.

Name your thing appropriately.  We used Weather Station. Then, add variables that are associated with the DHT11 sensor and the LED by clicking on Add Variable as shown.

Figure 7. Weather Station Add Variable button.

Adding Variables to Things

Add the following variables:

humidityfloat type as shown.  You should configure it in the UI as Read Only, and update periodically every 2 seconds.

Figure 8. Adding humidity variable

temperature – create it as a CloudTemperature type, read-only and updated every 2 seconds.  The CloudTemperature type is in the Energy category of types.

Figure 9. Add temperature variable

red_led – boolean type.  This should be configured as Read & Write, and updated On change.

Figure 10. Add red_led variable

Now we have a Weather Station thing representing our device in the platform as shown.

Figure 11. Weather Station Thing with three variables.

Next, we need to connect our device to the IoT Cloud!

Connecting our Device

To add our device, you can click on the link/Select Device button and select an Arduino device.

Figure 12. Select Arduino device.

You must then wait for the platform to connect to your local device.  If all goes well the browser will display something similar to the following:

Figure 13. Arduino MKR WiFi 1010 configuration.

Click on configure, and give your device a name.

Figure 14. Naming your device.

Once this is done the platform will upload a new sketch into the device that has the code necessary to communicate with the Arduino IoT Cloud.  Click on Done and your device will be shown.

Figure 15. Device shown in the Devices list.

Note that if your device is not linked to a thing as shown you can click on the Things Tab and then click on the Associate Device on the Weather Station thing to link it to your device.

At this point, you have created a thing, added the device, and uploaded a sketch to the device to support communications with the IoT Cloud.  Next we’ll modify the sketch to support the DHT11 and the LED.

Update Sketch to Update Thing Properties

To update the sketch you can click on the Sketch tab as shown below.  Clock on the Open full editor button to modify the sketch and its configuration in the Web Editor.

Figure 16. IoT Cloud Sketch Tab

Your Editor will look something like the following.

Figure 17. Web Editor with generated weather station sketch.

Click on the Secret tab and ensure the SSID and password for your wifi network is set correctly.

Notice the template sketch provided by the platform (See Appendix Listing 2) provides placeholders for you to fill in the loop code and onRedLedChange() with your own code.  This is where we need to add the code to read our sensor and turn the LED on and off.

Before we can read the DHT11 we need to include the library.  Click on the Libraries tab and then your favourites for the DHT11 library, and then Include the DHT11 library.

Figure 18. Including the DHT11 Library.

Now, replace the sketch generated by the platform with the code in Appendix Listing 3 following (copy paste into the same file).  This will fill in the loop() and onRedLedChange() methods and set up the DHT11 sensor reading.

Click on the Upload and Save -> button to upload and save this new sketch into the Arduino.  If all goes well, your device will now keep the IoT platform thing variables up to date as shown.

Figure 19. Updated Thing variables shown.

Developing Node-RED Flow on FRED

Next we’ll create an API key on the IoT Cloud to connect to FRED to do additional processing and notifications.

First, click on the Integrations tab, and then click on Create API Key.  Give the API key a name such as FRED.

Figure 20. Creating an API key to connect to FRED

Setting up FRED

Create an account on the FRED system https://fred.sensetecnic.com/  You can sign up for a paid plan or free plan.

Once you’ve created an account and validated your email, you will be able to login and see a standard Node-RED instance for creating your flows.  Before we can create our flow we need to install the Arduino IoT Cloud nodes.  Click on the Add or Remove Nodes tab on the left as shown below.

If you are new to Node-RED, you can find several introductory tutorials on our developer site and a complete programming course at our Node-RED programming guide.

Figure 21. Adding Nodes to FRED instance.

Search for Arduio and install the Ardiuno-Iot-Cloud nodes.  For debugging and simple charts we’ll use the Dataviewer node, and the Pushbullet node for notifications; install those as well.

We’ll initially create a flow that connects to the IoT Cloud and displays information and controls the LED.

First, drag a property node, and a data viewer node to display the data in a chart in the flow as shown.

Figure 22. Simple flow to create a chart of a property.

Next, configure the property node by double-clicking on it.  You’ll get the following modal.

Figure 23. Configuring the property node

Create a new arduino-connection by clicking on the pencil icon and fill in your Client ID and Client Secret you recorded when you configured your integration.

Figure 24. Adding IoT Cloud configuration node

Click on Add.  Your property node is now configured.  The node will communicate with the IoT cloud to retrieve the Things and properties it can interact with.

Select the thing for the property, “Weather Station”, and the temperature property.

Deploy the simple two node flow, and if all goes well, temperature readings should begin to appear in the data viewer.  The current value also appears under the property node as shown.  To see the values themselves, you may add a debug node to the property output as well.

Figure 25. Temperature property displayed in data view node

Congratulations, you’ve connected FRED to the Arduino IoT Cloud!  Next, we’ll add the humidity and LED control nodes using the following flow.

Figure 26. Flow to display temperature, humidity and control the red LED.

The flow illustrated above is shown in Appendix Listing 4.  You can import this flow by Click on the hamburger icon in the top right, choosing Import and then copying and pasting this listing into the import dialog as described in the Node-RED documentation.  

Given a few seconds you should now see both the current temperature and humidity readings and have the ability to control the LED.

Going Further: Adding High Temperature Notifications

Let’s take this a bit further and create a flow that lights the LED and sends a notification when the temperature rises above 20 degrees. We’ll then extend this to send notifications via Pushbullet. First, we’ll create a flow to detect the temperature and light the LED.

Figure 27. Flow to detect high temperature and light the LED

The flow shown above can be imported from Appendix Listing 5.  Note that the function node here is very simple; it sends a true or false in the output message payload depending the value of the message payload received:

if (msg.payload > 20) {
    msg.payload = true;
} else {
    msg.payload = false;
}
return msg;

This can easily be extended to do additional processing, perhaps a dynamic threshold, or check that the temperature is below freezing.

Connecting to Pushbullet

Next, let’s connect Pushbullet for remote notifications.  To use this service, you’ll need to sign up, install Pushbullet on your phone or computer and then create an API key.

Figure 28. Creating an access token on Pushbullet.

Record the API key (access token) provided; this will be used to connect FRED to pushbullet.

Now, add a pushbullet node to your flow as shown.  Configure it to push to your devices by providing the API key.

Now, you can modify the flow to include a function node to send notifications to Pushbullet when the temperature test transitions to true as shown.

Figure 29. Flow to send notifications to Pushbullet when temperature is high

The associated flow can be imported from Appendix Listing 6.

Note that the send notification function node uses the Node-RED context feature to maintain state about whether a notification has been sent already.  For more information on how Node-RED context works see the associated documentation.

The function Setup code (in the function node Setup tab) is as follows:

if (context.get("notificationSent") === undefined) {
    context.set("notificationSent", false);
}

The function node code that sends the notification is as follows:

let notificationSent = context.get("notificationSent");

if (msg.payload) {
    if (!notificationSent) {
        msg.payload = "Temperature is too high!"
        context.set("notificationSent", true);
        return msg;   
    }
} else {
    context.set("notificationSent", false);
}

Now, when the temperature transitions more than 20 degrees, the LED will light, and you’ll get a Pushbullet notification on your device!

Note that free pushbullet accounts are limited to 500 notifications per month so do not leave this flow running otherwise you may exceed your limit!

Conclusion

The Arduino IoT Cloud makes it very easy to connect Arduino devices and visualize basic sensor data. However, if you want to create simple IoT applications for monitoring and control, then you need a general purpose service such as FRED. By combining FRED and the Arduino IoT Cloud, you get the ease of connectivity of Arduino and the power and flexibility of FRED – a winning combination!

Appendix

This appendix contains the Arduino device sketches and Node-RED flows hosted by FRED that needed for this tutorial.

Listing 1

Test program for the weather station prototype device

/*
  Test weather station sketch
*/
#include <DHT.h>
#include <DHT_U.h>

#define DHTPIN 2
#define DHTTYPE DHT11

const int ALERT_LED = 8;      // the number of the LED pin
bool led_state = false;

DHT dht(DHTPIN, DHTTYPE);

void setup() {
  pinMode(ALERT_LED, OUTPUT);
  
  // initialize the DHT sensor
  dht.begin();

  // Initialize serial and wait for port to open:
  Serial.begin(9600);
  
  // This delay gives the chance to wait for a Serial Monitor
  // without blocking if none is found
  delay(1500);
}

void loop() {
  delay(2000); 

  // Reading temperature or humidity takes about 250 milliseconds!
  // Sensor readings may also be up to 2 seconds 'old'
  // (its a very slow sensor)
  float h = dht.readHumidity();

  // Read temperature as Celsius (the default)
  float t = dht.readTemperature();

  // Read temperature as Fahrenheit (isFahrenheit = true)
  float f = dht.readTemperature(true);

  // Check if any reads failed and exit early (to try again).
  if (isnan(h) || isnan(t) || isnan(f)) {
    Serial.println(F("Failed to read from DHT sensor!"));
    return;
  }

  // Compute heat index in Fahrenheit (the default)
  float hif = dht.computeHeatIndex(f, h);
  // Compute heat index in Celsius (isFahreheit = false)
  float hic = dht.computeHeatIndex(t, h, false);
  
  Serial.print(F("Humidity: "));
  Serial.print(h);
  Serial.print(F("%  Temperature: "));
  Serial.print(t);
  Serial.print(F("°C "));
  Serial.print(f);
  Serial.print(F("°F  Heat index: "));
  Serial.print(hic);
  Serial.print(F("°C "));
  Serial.print(hif);
  Serial.println(F("°F"));
  
  if (led_state) {
    Serial.println("turn LED on");
    digitalWrite(ALERT_LED, HIGH);
    led_state = false;
  } else {
    Serial.println("turn LED off");
    digitalWrite(ALERT_LED, LOW);
    led_state = true;
  }
}

Listing 2

Template sketch generated by the IoT Cloud to communicate with the IoT Cloud that provides placeholders to update variables.

/* 
  Sketch generated by the Arduino IoT Cloud Thing "Weather Station"
  https://create.arduino.cc/cloud/things/xxx-xxx-xxx-xxx-xxx 

  Arduino IoT Cloud Variables description

  The following variables are automatically generated and updated when changes are made to the Thing

  bool red_led;
  float humidity;
  CloudTemperature temperature;

  Variables which are marked as READ/WRITE in the Cloud Thing will also have functions
  which are called when their values are changed from the Dashboard.
  These functions are generated with the Thing and added at the end of this sketch.
*/

#include "thingProperties.h"

void setup() {
  // Initialize serial and wait for port to open:
  Serial.begin(9600);
  // This delay gives the chance to wait for a Serial Monitor without blocking if none is found
  delay(1500); 

  // Defined in thingProperties.h
  initProperties();

  // Connect to Arduino IoT Cloud
  ArduinoCloud.begin(ArduinoIoTPreferredConnection);
  
  /*
     The following function allows you to obtain more information
     related to the state of network and IoT Cloud connection and errors
     the higher number the more granular information you’ll get.
     The default is 0 (only errors).
     Maximum is 4
 */
  setDebugMessageLevel(2);
  ArduinoCloud.printDebugInfo();
}

void loop() {
  ArduinoCloud.update();
  // Your code here 
  
  
}

/*
  Since RedLed is READ_WRITE variable, onRedLedChange() is
  executed every time a new value is received from IoT Cloud.
*/
void onRedLedChange()  {
  // Add your code here to act upon RedLed change
}

Listing 3

Weather station prototype sketch to update humidity, temperature based on DHT11 readings and turn the red LED and off based on the state of the red_led variable.

// DHT sensor library - Version: Latest 
#include <DHT.h>
#include <DHT_U.h>
#include "thingProperties.h"

const int ALERT_LED = 8;      // the number of the LED pin

#define DHTPIN 2
#define DHTTYPE DHT11

DHT dht(DHTPIN, DHTTYPE);

void setup() {
  pinMode(LED_BUILTIN, OUTPUT);
  pinMode(ALERT_LED, OUTPUT);
  
  // initialize the DHT sensor
  dht.begin();

  // Initialize serial and wait for port to open:
  Serial.begin(9600);
  // This delay gives the chance to wait for a Serial Monitor
  delay(1500); 

  // Defined in thingProperties.h
  initProperties();

  // Connect to Arduino IoT Cloud
  ArduinoCloud.begin(ArduinoIoTPreferredConnection);
  
  /*
     The following function allows you to obtain more information
     related to the state of network and IoT Cloud connection and errors
     the higher number the more granular information you’ll get.
     The default is 0 (only errors).
     Maximum is 4
 */
  setDebugMessageLevel(2);
  ArduinoCloud.printDebugInfo();
}

void loop() {
  ArduinoCloud.update();
  // Your code here 
  delay(2000); 

  // Reading temperature or humidity takes about 250 milliseconds!
  // Sensor readings may also be up to 2 seconds 'old'
  // (its a very slow sensor)
  float h = dht.readHumidity();

  // Read temperature as Celsius (the default)
  float t = dht.readTemperature();

  // Read temperature as Fahrenheit (isFahrenheit = true)
  float f = dht.readTemperature(true);

  // Check if any reads failed and exit early (to try again).
  if (isnan(h) || isnan(t) || isnan(f)) {
    Serial.println(F("Failed to read from DHT sensor!"));
    return;
  }

  // Compute heat index in Fahrenheit (the default)
  float hif = dht.computeHeatIndex(f, h);
  // Compute heat index in Celsius (isFahreheit = false)
  float hic = dht.computeHeatIndex(t, h, false);

  temperature = t;
  humidity = h;
  
  Serial.print(F("Humidity: "));
  Serial.print(h);
  Serial.print(F("%  Temperature: "));
  Serial.print(t);
  Serial.print(F("°C "));
  Serial.print(f);
  Serial.print(F("°F  Heat index: "));
  Serial.print(hic);
  Serial.print(F("°C "));
  Serial.print(hif);
  Serial.println(F("°F"));
}

/*
  Since RedLed is READ_WRITE variable, onRedLedChange() is
  executed every time a new value is received from IoT Cloud.
*/
void onRedLedChange()  {
  // Add your code here to act upon RedLed change
  if (red_led) {
    Serial.println("red_led on");
    digitalWrite(ALERT_LED, HIGH); 
  } else {
    Serial.println("red_led off");
    digitalWrite(ALERT_LED, LOW);
  }
}

Listing 4

Flow to display temperature, humidity using data viewer nodes and control the red LED using inject nodes.

[
    {
        "id": "ad260a66.fea098",
        "type": "property in",
        "z": "bfbf6707.89c1e8",
        "connection": "f4c46bfe.1d2748",
        "thing": "bd56b98b-2b40-4787-aa3e-da76eb100cf9",
        "property": "920f2567-7df8-408a-9c93-814d76d34b35",
        "name": "temperature",
        "propname": "temperature",
        "defaultname": true,
        "variableName": "temperature",
        "x": 190,
        "y": 200,
        "wires": [
            [
                "a4e71cd0.afb4b"
            ]
        ]
    },
    {
        "id": "a4e71cd0.afb4b",
        "type": "data-view",
        "z": "bfbf6707.89c1e8",
        "name": "",
        "property": "payload",
        "fieldType": "msg",
        "width": 200,
        "height": 160,
        "points": 10,
        "active": true,
        "passthru": false,
        "hide": true,
        "outputs": 0,
        "x": 440,
        "y": 200,
        "wires": []
    },
    {
        "id": "f4808533.8eff58",
        "type": "property in",
        "z": "bfbf6707.89c1e8",
        "connection": "f4c46bfe.1d2748",
        "thing": "bd56b98b-2b40-4787-aa3e-da76eb100cf9",
        "property": "69cf78e4-8f87-4cea-8741-106b5ebec761",
        "name": "humidity",
        "propname": "humidity",
        "defaultname": true,
        "variableName": "humidity",
        "x": 190,
        "y": 460,
        "wires": [
            [
                "28d52b3f.d1d694"
            ]
        ]
    },
    {
        "id": "28d52b3f.d1d694",
        "type": "data-view",
        "z": "bfbf6707.89c1e8",
        "name": "",
        "property": "payload",
        "fieldType": "msg",
        "width": 200,
        "height": 160,
        "points": 10,
        "active": true,
        "passthru": false,
        "hide": true,
        "outputs": 0,
        "x": 450,
        "y": 460,
        "wires": []
    },
    {
        "id": "c59a0433.d9ee28",
        "type": "property out",
        "z": "bfbf6707.89c1e8",
        "connection": "f4c46bfe.1d2748",
        "thing": "bd56b98b-2b40-4787-aa3e-da76eb100cf9",
        "property": "08ef1d84-3d38-4541-bcf8-7155540f841d",
        "name": "red_led",
        "propname": "red_led",
        "defaultname": true,
        "x": 440,
        "y": 680,
        "wires": []
    },
    {
        "id": "e4731397.15691",
        "type": "inject",
        "z": "bfbf6707.89c1e8",
        "name": "",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "true",
        "payloadType": "bool",
        "x": 180,
        "y": 660,
        "wires": [
            [
                "c59a0433.d9ee28"
            ]
        ]
    },
    {
        "id": "fa7575e9.2ca8f8",
        "type": "inject",
        "z": "bfbf6707.89c1e8",
        "name": "",
        "props": [
            {
                "p": "payload"
            },
            {
                "p": "topic",
                "vt": "str"
            }
        ],
        "repeat": "",
        "crontab": "",
        "once": false,
        "onceDelay": 0.1,
        "topic": "",
        "payload": "false",
        "payloadType": "bool",
        "x": 180,
        "y": 720,
        "wires": [
            [
                "c59a0433.d9ee28"
            ]
        ]
    },
    {
        "id": "f4c46bfe.1d2748",
        "type": "arduino-connection",
        "applicationname": "IoT Cloud"
    }
]

Listing 5

Flow to light the red LED when the temperature rises above 20 degrees.

[
    {
        "id": "93e44a06.81f868",
        "type": "property in",
        "z": "a8d29cdf.fe1dd",
        "connection": "f4c46bfe.1d2748",
        "thing": "bd56b98b-2b40-4787-aa3e-da76eb100cf9",
        "property": "920f2567-7df8-408a-9c93-814d76d34b35",
        "name": "temperature",
        "propname": "temperature",
        "defaultname": true,
        "variableName": "temperature",
        "x": 130,
        "y": 160,
        "wires": [
            [
                "86194a5b.fc3188",
                "b5175095.a84f5"
            ]
        ]
    },
    {
        "id": "86194a5b.fc3188",
        "type": "function",
        "z": "a8d29cdf.fe1dd",
        "name": "",
        "func": "if (msg.payload > 20) {\n    msg.payload = true;\n} else {\n    msg.payload = false;\n}\nreturn msg;\n",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "x": 340,
        "y": 160,
        "wires": [
            [
                "f658a4f6.4d72f8"
            ]
        ]
    },
    {
        "id": "b5175095.a84f5",
        "type": "data-view",
        "z": "a8d29cdf.fe1dd",
        "name": "",
        "property": "payload",
        "fieldType": "msg",
        "width": 200,
        "height": 160,
        "points": 10,
        "active": true,
        "passthru": false,
        "hide": true,
        "outputs": 0,
        "x": 330,
        "y": 240,
        "wires": []
    },
    {
        "id": "f658a4f6.4d72f8",
        "type": "property out",
        "z": "a8d29cdf.fe1dd",
        "connection": "f4c46bfe.1d2748",
        "thing": "bd56b98b-2b40-4787-aa3e-da76eb100cf9",
        "property": "08ef1d84-3d38-4541-bcf8-7155540f841d",
        "name": "red_led",
        "propname": "red_led",
        "defaultname": true,
        "x": 540,
        "y": 160,
        "wires": []
    },
    {
        "id": "f4c46bfe.1d2748",
        "type": "arduino-connection",
        "applicationname": "IoT Cloud"
    }
]

Listing 6

Flow that sends notifications when the threshold rises above 20 degrees.

Note that you are limited to only 500 notifications per month, so do not leave this flow running too long!

[
    {
        "id": "93e44a06.81f868",
        "type": "property in",
        "z": "a8d29cdf.fe1dd",
        "connection": "f4c46bfe.1d2748",
        "thing": "bd56b98b-2b40-4787-aa3e-da76eb100cf9",
        "property": "920f2567-7df8-408a-9c93-814d76d34b35",
        "name": "temperature",
        "propname": "temperature",
        "defaultname": true,
        "variableName": "temperature",
        "x": 110,
        "y": 140,
        "wires": [
            [
                "86194a5b.fc3188",
                "b5175095.a84f5"
            ]
        ]
    },
    {
        "id": "86194a5b.fc3188",
        "type": "function",
        "z": "a8d29cdf.fe1dd",
        "name": "test temperature",
        "func": "if (msg.payload > 20) {\n    msg.payload = true;\n} else {\n    msg.payload = false;\n}\nreturn msg;\n",
        "outputs": 1,
        "noerr": 0,
        "initialize": "",
        "finalize": "",
        "x": 340,
        "y": 140,
        "wires": [
            [
                "f658a4f6.4d72f8",
                "1c64469f.67b679"
            ]
        ]
    },
    {
        "id": "b5175095.a84f5",
        "type": "data-view",
        "z": "a8d29cdf.fe1dd",
        "name": "",
        "property": "payload",
        "fieldType": "msg",
        "width": 200,
        "height": 160,
        "points": 10,
        "active": true,
        "passthru": false,
        "hide": true,
        "outputs": 0,
        "x": 330,
        "y": 240,
        "wires": []
    },
    {
        "id": "f658a4f6.4d72f8",
        "type": "property out",
        "z": "a8d29cdf.fe1dd",
        "connection": "f4c46bfe.1d2748",
        "thing": "bd56b98b-2b40-4787-aa3e-da76eb100cf9",
        "property": "08ef1d84-3d38-4541-bcf8-7155540f841d",
        "name": "red_led",
        "propname": "red_led",
        "defaultname": true,
        "x": 560,
        "y": 100,
        "wires": []
    },
    {
        "id": "432d96f7.6fb348",
        "type": "pushbullet",
        "z": "a8d29cdf.fe1dd",
        "config": "6af4f9cc.950b08",
        "pushtype": "note",
        "title": "",
        "chan": "",
        "name": "",
        "x": 690,
        "y": 280,
        "wires": []
    },
    {
        "id": "1c64469f.67b679",
        "type": "function",
        "z": "a8d29cdf.fe1dd",
        "name": "send notification message",
        "func": "let notificationSent = context.get(\"notificationSent\");\n\nif (msg.payload) {\n    if (!notificationSent) {\n        msg.payload = \"Temperature is too high!\"\n        context.set(\"notificationSent\", true);\n        return msg;   \n    }\n} else {\n    context.set(\"notificationSent\", false);\n}\n",
        "outputs": 1,
        "noerr": 0,
        "initialize": "if (context.get(\"notificationSent\") === undefined) {\n    context.set(\"notificationSent\", false);\n}\n",
        "finalize": "",
        "x": 580,
        "y": 180,
        "wires": [
            [
                "432d96f7.6fb348"
            ]
        ]
    },
    {
        "id": "f4c46bfe.1d2748",
        "type": "arduino-connection",
        "applicationname": "IoT Cloud"
    },
    {
        "id": "6af4f9cc.950b08",
        "type": "pushbullet-config",
        "name": "Mike Pushbullet"
    }
]

FRED (Cloud Node-RED) and cryptocurrencies

Accessing Cryptocurrency data via the STS Binance node

We’ve seen a few folks playing around with FRED to access – and in some cases – trade on cryptocurrencies, which we thought was a fun use of Node-RED. Our very own crypto expert, Ted, here at STS decided to jump in and develop a new Node for accessing and using the Binance cryptocurrency platform. Continue reading “FRED (Cloud Node-RED) and cryptocurrencies”

Monitor a Pi Zero-hosted security camera with Node-RED, FRED and STS-MQTT

The new Pi Zero W is a great hardware platform for creating all kinds of interesting hardware gadgets.  With built in bluetooth, wifi, and a camera connector, it seems like the ideal system for creating a security cam.  Of course one of the best things about the Pi Zero is that it runs Node-RED! Continue reading “Monitor a Pi Zero-hosted security camera with Node-RED, FRED and STS-MQTT”

Tutorial: Connect Arduino boards to FRED (Cloud Node-RED) via ESP8266 and the STS-MQTT platform

This tutorial will show you how to use FRED — a cloud-based Node-RED — to control and read data from Arduino boards using an ESP8266 module and the STS-MQTT platform. The ESP8266 is a popular, low cost Wifi module Continue reading “Tutorial: Connect Arduino boards to FRED (Cloud Node-RED) via ESP8266 and the STS-MQTT platform”

Using public data feeds on the STS-MQTT platform using Node-RED

MQTT is a popular protocol for data transmission for many developers, especially for Internet of Things applications. The new Sense Tecnic MQTT service (STS MQTT) provides FRED users an easy way to setup and to manage MQTT connections with devices and Node-RED on FRED. This blog post shows you how to use the public data feeds feature on our STS-MQTT platform for publishing and subscribing to public data streams. Continue reading “Using public data feeds on the STS-MQTT platform using Node-RED”

Tutorial: Using FRED (Cloud Node-RED) to build an AI chatbot using IBM Watson

This tutorial shows you how to use FRED — a cloud-based Node-RED — to build an AI chatbot using the IBM Watson Conversation service as the Natural Language Understanding (NLU) agent.

Building a smart chatbot can be complex. In this tutorial, we will show you how to build an AI chat bot by writing a Node-RED flow on the cloud-service (FRED) that can handle multiple users and maintain the context of conversations on the cloud server. We will be using the node-red-contrib-chatbot node and the node-red-node-watson node. We will also show you how to set up the IBM Watson Conversation service and use it to interpret natural English language input from users. Finally, we will use the Walmart database API in the tutorial sample for product information.

Node-RED provides a great way to connect various messenger platforms to online AI services, and it is capable of performing various processing tasks upon receiving requests from users. This is what makes a Node-RED AI chatbot exciting.

We have provided sample code here. If you do not know how to import flows, you can refer to this article.

Create a FRED Account

If you don’t already have an account on FRED (Cloud Node-RED), set one up now. It’s free for a demo account, which can be used for these tutorials and any other experiments you may have with Node-RED. Register for a free account at http://fred.sensetecnic.com.

After registering, make sure to activate your account via your email. You will not be able to log in until you validate your account.

 

About IBM Watson Conversation

IBM Watson is a growing software platform that provides easy access to artificial intelligent (AI) services for commercial and development usages. The Watson Conversation service is one of the Watson applications that uses machine learning to understand and interpret natural human language input and to output the appropriate response to simulate a natural conversation between humans. Developers can supply data and train the conversation application as defined for various purposes. Therefore, by using the IBM Watson Conversation service, a chatbot can both output correct analytic data to software applications and natural human language to users.

 


About Sense Tecnic: Sense Tecnic Systems Inc have been building IoT applications and services since 2010. We provide FRED, cloud hosted Node-RED as a service to the community. We also offer a commercial version to our customers, as well as professional services. Learn more.


The user story for this tutorial

A local shop has decided to expand their online chatbot services for quick and easy access to their products. When customers initiate the conversation, they can ask the chatbot to recommend products by searching its database of products (which we mock-up using the Walmart online database). Users can further ask the chatbot about the price, product details, customer reviews, stock, and send orders online.  

They decided to set this up by using FRED to implement a Node-RED back-end process, various messenger platforms (as front-end, we are using telegram in this case) and IBM Watson Conversation for the natural language interpreter, which interprets the natural language input from customers.

 

Quick peek of the result

Screen Shot 2017-01-18 at 3.32.20 PMScreen Shot 2017-01-18 at 3.32.28 PM

Data flow of this tutorial chatbot

Untitled Diagram

 

Prerequisites

To create an AI chatbot as in this sample, you will need the following:

  1. If you don’t already have a free FRED account, set one up
  2. If you don’t already have an IBM Watson account, set one up
  3. We will be using Telegram as the messenger platform. If you don’t have an account, set one up
  4. We will use the Walmart database API for the mocked sample. If you don’t have access, sign up for an account here
  5. Once you are setup, you can import the sample Node-RED flows from here

 

Outline of the tutorial

  1. Setup Watson Conversation application
  2. Create a new chatbot on Telegram
  3. Connect Telegram messenger to FRED
  4. Connect FRED to the Watson Conversation application
  5. Write a Node-RED flow on FRED that handles requests from the users, and supplies the correct response

 

Setup Watson Conversation application

Once you have setup your IBM Watson account, you can go to the Watson Conversation workspace. We have prepared a sample JSON file for you here. You can simply import the sample application to get it working right away. We will briefly explain what this application does later on.

When you are in your workspace, you will see these at the top.

Screen Shot 2017-01-19 at 11.51.42 AM

Click the Up arrow to upload a JSON file.

Screen Shot 2017-01-19 at 11.52.03 AM

Once it is done. You will see this app in your workspace.

Screen Shot 2017-01-19 at 11.54.46 AM

When you click this app, you will be able to see the contents in the app. There are three main tabs in this app, the Intents, the Entities, and the Dialog.

  • Intents: These are the user defined actions, and their names begin with # in a Watson Conversation. We have set up 9 intents in the sample app, including: #getReviews, #getDetails, #checkPrice, #checkOnlineStock, #order, #searchItems, #greeting, #goodbye, #thankyou. 

Normally, when you start a new conversation application, you need to train the Watson application to interpret users’ input and be able to match this input with the correct intents.

  • Entities: These are the user defined “keywords” that the Watson Conversation program can recognize in the conversations. It’s important for Watson to pick up the keywords in the conversation, and it helps us in implementing the chatbot.

Since our goal is to set up a smart inventory inquiry chatbot, it is necessary for the bot to pick up all possible words that could be used in searching. We had done some data processing in the “category” field, with their possible synonyms in natural conversations. Don’t be scared by the amount of words. These words were taken from the Walmart taxonomy API.

  • Dialog: These set the possible responses from the bot when a user enter inputs. Watson Conversation provides a visual editor for users to design their dialog flow. Since we have quite a few intents, it would be complex to design subdialog nodes for each intent. (You will have to map all possible dialog flows, otherwise the bot might not know what to response when users change the topic! ) We decided to have all dialog nodes at the root level, and let FRED maintain the conversation context.

 

Once you’ve uploaded the application, you will need to train your program with the data supplied. Watson should automatically starts the training process. You can check the status by clicking this button on the top right corner to open the dialog window:

Screen Shot 2017-02-16 at 10.54.08 AM

and you will see Watson is training with the data you supplied:

Screen Shot 2017-02-16 at 10.54.15 AM

It wouldn’t take long before you see this showing up indicating the training process is complete:

Screen Shot 2017-02-16 at 10.54.56 AM

Once Watson finishes training the conversation application, we can leave it for now and move to the next step.

 

Create a new chatbot on Telegram

We are using Telegram as the messenger platform for this tutorial merely because is simple and quick to setup. In fact, you are more than welcome to use any messenger platforms you want as long as you can connect to FRED. Telegram has thorough instructions on how to setup a chatbot using Botfather here.

 

Connect Telegram messenger to FRED

To connect the telegram chatbot to FRED, we will need to install node-red-contrib-chatbot to your FRED account. To do that, use the management panel on the left of the FRED UI,  select Add or Remove Nodes and look for the chatbot node in the list of nodes FRED provides. Select it and install.

Screen Shot 2017-02-16 at 11.40.30 AM

Then, we will drag the Telegram Receiver node and the Telegram Sender node onto the editor. Double click on one node, setup the bot information by entering the bot API key that you received when you created the chatbot on Telegram. If it all works out, you should see these nodes indicating that they are connected.

Screen Shot 2017-01-19 at 2.17.49 PM

You can connect these two nodes, and start a conversation to this bot on Telegram. If you have set up correctly, you should see echo messages coming back on the Telegram messenger (receiver).

We are going to use multiple tabs in Node-RED for this application, and make use of the link node to connect flows between tabs. Let’s name this tab as Messenger to FRED, since it only contains nodes for communicating with messenger platforms. We will use link nodes to connect to other flows in other tabs. We will link the flows at the end.

We also want to keep the original message content from the Telegram Receiver node because it contains information that is required to send the message back to the users on Telegram. We will use a change node to save the telegram messages by setting msg.telegramBot to msg.payload.

So far, the setup should look like this:

Screen Shot 2017-01-19 at 2.33.47 PM

Now the messengers are connected to FRED, we will continue to the next step.

 

Connect FRED to Watson Conversation

 

For this part, we will need to install node-red-node-watson. You can find this node in Add or Remove Nodes. This is a set of nodes developed by IBM that can connect to Watson services. (Note, this is a subset of the IBM nodes. We have ported and tested these on FRED since they weren’t designed to run in a shared cloud environment)

 

Screen Shot 2017-02-16 at 11.40.38 AM

Let’s create a new tab in the editor called “FRED to Watson”.

Similar to the previous section, we will be using two link nodes to connect to other tabs. We will also need two change nodes and the Watson Conversation node that you just installed.

Screen Shot 2017-01-19 at 2.42.48 PM

In the configuration tab of the conversation node, you will need some info from the Watson Conversation workspace. Let’s head back to Watson Conversation workspace.

Screen Shot 2017-01-19 at 2.49.57 PM

When you click the Actions button -> View details, you should see the Workspace ID, copy that down to the Watson Conversation node. Then, go to the Bluemix dashboard, click the conversation service in all service, then click the “service credentials” tab, you will be able to find the username and password to access your conversation app.

Screen Shot 2017-01-19 at 3.37.08 PM

Screen Shot 2017-01-19 at 3.37.40 PM And this is how the config tab of the Conversation node should look like:

Screen Shot 2017-01-19 at 3.50.19 PM

The “prepare to send to watson” change node simply sets msg.payload to msg.telegramBot.content, so we can send the text content from Telegram to Watson. Then, we have the “save to watsonMsg” change node where we set msg.watsonMsg to msg.payload to save the output of Watson Conversation for further process.

Now, back to the “messenger to FRED” tab, we also need to send the output from msg.watsonMsg back to the Telegram Sender node.

We will add one Function node in front of the Telegram Sender node, with the following content.

And the flow in “Messenger to FRED” should look like:

Screen Shot 2017-01-19 at 4.01.55 PM

As you can see, we first merge the output from Watson Conversation to the Telegram message that we had stored earlier, and we finally set msg.payload to the Telegram message we have saved and send it to Telegram Sender node.

At this point, you have already connected the Telegram chatbot to Watson Conversation. If you connect these flows together, you should be able to get simple responses from Watson to Telegram:

Screen Shot 2017-01-19 at 4.20.51 PM

 

The Node-RED flows that do the amazing stuff

Now comes the hard part. We want the chatbot to be able to perform certain tasks upon requests. In our user story, this chatbot is able to provide simple recommendations and check info such as availability, price and customer reviews. Since we are using the Walmart database API as a mock back-end database, let’s start a new tab call “FRED to Walmart API”.

Again, we will have two link nodes that connect from the flow in the “FRED to Watson” tab and to the “Messenger to FRED” tab. We will set a Switch node to send the message to different function nodes according to the users’ intent. We will perform different tasks and combine the output back to msg.watsonMsg.output.text, which will be merged into msg.telegramBot and sent back to Telegram later on.

As you can see from this diagram, we have set four stages in this example. The first stage is to get the response from Watson, and we add the Walmart API key that we got from the Walmart database API. The second stage is where we inspect the Watson response and send it to different function nodes according to the intent. For example, if the intent is “searchItems”, the function node “searchItems” will go through the entities array from the Watson response, and generate msg.url for the HTTP request node. The third stage is to call the database APIs. The last stage is to combine the result back to msg.watsonMsg, where it will be further processed later on.

You can import these flows from the sample code provided on our Github. If you are not sure how to import flow codes, please refer to: here.

Also, if you have been following the tutorial, we need to make a small modification to the “send back to telegram” node in the “messenger to FRED” tab because we had modified the message in “FRED to Walmart API” tab. The updated code for “send back to telegram” node would look like this:

Screen Shot 2017-01-20 at 1.43.34 PM

In general, the second and the third stage is where you design the functionality of your chatbot. You are more than welcome to design your own features.

 

At this stage, you have a basic, simple chatbot that uses the watson functionality to understand natural language. This is already pretty impressive  ….

But, a smart chatbot should also know the context!

However, the chatbot we have so far can only respond to the current input from users. Although it can handle multiple user inputs, it still cannot relate the input to the overall conversation context. We need to do this if we want to make our chatbot “smart”.

The general idea in this section is to show you how we can use FRED to keep context of the conversation. In this sample, there will be a few spots that we need to save the data on FRED.

  1. When the user send in a search query, we want to save the search result in the context
  2. When the user send in an arbitrary item number, we want to be able to retrieve the search result from the context
  3. When the user send in a word like “it”, we want to be able to retrieve the item number that the user was talking about earlier.
  4. When the message is sent out, we want to keep the context by mapping with the Telegram chatId.
  5. When a message comes in, we want to be able to retrieve the context data from memory by using the Telegram ChatID.

 

First, let’s save the message context for each user. Let’s go to the “Messenger to FRED” tab, and add a function node before sending out the message to Telegram sender node. The purpose of this node is to save the context on local mapping to the chatId that was shown in the Telegram message. If you have a lot of data flowing, you can also save the context to a database (See our tutorial on using SQL lite).

Here is how we save the context

Screen Shot 2017-01-20 at 11.42.09 AM

You will also need a node to pull out this saved context when message was sent in from telegram, we can add this node:

Screen Shot 2017-01-20 at 11.43.32 AM

So, the flow in “Messenger to FRED” would look like this:

Screen Shot 2017-01-20 at 11.43.55 AM

We can leave the “FRED to Watson” tab as it is. We will need to add some more nodes in “FRED to Walmart API” tab.

As you had seen in the sample conversation above, we sent out a menu from the chatbot, and the user refers to the item on the list. In order to maintain the status, we would want to keep a record of the item number and also the item search result.

We first add a function node after calling the search items API to save the search result.

Screen Shot 2017-01-20 at 1.59.16 PM

We also add a function node before the switch to get the item number:

Screen Shot 2017-01-20 at 1.59.40 PM

and now the flow would look like:

Screen Shot 2017-01-20 at 1.59.51 PM

Now if you connect all the flows, you would have an AI chatbot that can handle multiple users and maintain conversational context!

 

Ok, that’s it – it’s quite a complex tutorial, but we think you’ll agree, the resulting chatbot is very impressive. What’s more, this basic example can now be modified to adapt to your specific needs – have fun!

 

 

About Sense Tecnic: Sense Tecnic Systems Inc have been building IoT applications and services since 2010. We provide FRED, cloud hosted Node-RED as a service to the community. We also offer a commercial version to our customers, as well as professional services. Learn more.


 

 

Tutorial: Using FRED (Cloud Node-RED) with the GE Predix Timeseries Microservice

This tutorial shows you how to use FRED — a cloud based Node-RED — to connect to the General Electric’s Predix platform and use the Timeseries microservice. We make use of a new node we’ve created, node-red-contrib-predix-timeseries, on the FRED cloud-hosted Node-RED service. Continue reading “Tutorial: Using FRED (Cloud Node-RED) with the GE Predix Timeseries Microservice”

Tutorial: Controlling an Artik board using FRED and Node-RED

This tutorial shows you how to use FRED — a cloud based Node-RED — to connect to the Samsung Artik hardware modules for remote control and visualization. We make use of the node-red-contrib-artik and node-red-contrib-fred nodes on the Artik board and on the FRED cloud-hosted Node-RED service. Continue reading “Tutorial: Controlling an Artik board using FRED and Node-RED”

Tutorial: Connecting device Node-RED to cloud Node-RED

Using the FRED node on a device (Pi, Artik, Edison, etc) to connect directly to Node-RED in the cloud

A lot of Node-RED developers want to use Node-RED on their devices (Pi, Artik, Edison etc) and also in the Cloud. FRED provides a cloud hosted Node-RED so it’s natural to want to connect your device flows to your FRED Continue reading “Tutorial: Connecting device Node-RED to cloud Node-RED”

Tutorial: A Node-RED dashboard using node-red-dashboard

This is a simple example of reading and visualizing data using the new UI nodes from node-red-dashboard. We’ll be using the Cloud based FRED service as our Node-RED engine and visualizing a simple random data feed to show how to create a simple dashboard that looks like this:

NOTE: For existing FRED users – This is the new version of the UI nodes that many of you might be already using. The old version of UI nodes are still available(and it is still named as “UI nodes”, but the link to the old UI dashboard is changed to “/red/legacy_ui/“.

The sample flow of this tutorial can be found in this link.

Other approaches

If you are looking for more ideas on how to create dashboards using Node-RED, check out the dashboard lecture in our lecture series. It explores three approaches to dashboards – this approach which uses the built in dashboard nodes, the use of a third party dashboard tool – freeboard. And a generic approach that uses a javascript charting library and the http in/out nodes. All lectures are available at: http://noderedguide.com/

 

What is Node RED?

Node-RED is a visual tool for wiring the Internet of Things developed by IBM Emerging Technology and the open source community. Using Node-RED, developers wire up input, output and processing nodes to create flows to process data, control things, or send alerts. It works by allowing you to wire up web services or custom “nodes” to each other, or to things, to do things like:

  • Send an email on a rainy weather forecast.
  • Push sensor data to services like Twitter.
  • Perform complex analysis on data with ease.

showcase-flow

If you’re new to Node RED you might find our Introduction to Node RED tutorial very helpful.

What is FRED

Front End for Node-RED (FRED) manages instances of Node-RED for multiple users in the cloud. We manage and optimize your instance of Node RED so you worry about accomplishing your project, not setting up and maintaining your Node-RED instance.

Create a FRED Account

To begin our tutorial create your own Node-RED instance in the cloud. Register for a free account at http://fred.sensetecnic.com.

After registering make sure to activate your account via your email. You will not be able to login until you validate your account.

 


About Sense Tecnic: Sense Tecnic Systems Inc have been building IoT applications and services since 2010. We provide FRED, cloud hosted Node-RED as a service to the community. We also offer a commercial version to our customers, as well as professional services. Learn more.


Introduction to the dashboard nodes from node-red-dashboard

Let’s start by looking at the node-red-dashboard nodes and getting a simple dashboard setup.

To start, let’s wire up a simple flow that sends a random number between 0 and 99 to a simple chart. For that you’ll need an inject node to repeatedly fire every few seconds, a function node to generate the random number and one of the  node-red-dashboard nodes – in this case the chart node.

 

screen-shot-2016-10-12-at-4-38-47-pm

Before we look a how the chart node works, let’s configure the inject node to send a timestamp every 5 seconds by setting the payload to timestamp and the repeat field to an interval of 5 seconds.

 

Screen Shot 2016-05-16 at 12.46.11 PM

 

This will act as our repeating trigger. Now we need to set up the function node to generate a random number – we’ll use a simple JS math function to do this:

msg.payload = Math.round(Math.random()*100);
return msg;

Screen Shot 2016-05-16 at 12.48.42 PM

That will generate a random number between 0 ~ 99 which is passed to the chart node.

 

So now let’s take a look at the chart node. When you double click it, you’ll see it’s configuration options:screen-shot-2016-10-12-at-4-46-53-pm

If you click on the button of the Group field, you will be prompted  to configure the tabs of the UI.

screen-shot-2016-10-12-at-4-42-04-pm

The Tab option allows you to specify which tab of the UI page you will see the UI element on – in this case our chart. The default tab is Home – which we are using here. If you select the edit button to the right of the Tab field you can create a new tab and then select that. However, we’ll use the default home for now.

The Name field is the standard Node-RED node name – by default this is chart but you can set it to anything you like.

The Group field allows you to group UI elements – we’ll show you how that works when we add another UI element so let’s use group “Default[Home]” for now – of course, you can use any string you like.

The X-asis field allows you to tell the chart how much data it should store and display – the longer the ‘last‘ filed is set to, the more data is stored and displayed by the chart. Let’s use a short 5 mins which will start to throw away the data that is 5 minutes old.

Lastly the Interpolate field defines how the chart will interpolate values in between actual data values it receives, you can select between linear, step, b-spline and cardinal – which are standard interpolation algorithms. We’ll use the default linear.

Wire these nodes up, hit the deploy button – check that your debug node is showing that random values are showing. Then head over to your default dashboard page to see the results. By default, under FRED, you’ll see your UI at:

https://{username}.fred.sensetecnic.com/api/ui/

When you visit that page you’ll see your initial chart as shown below:

screen-shot-2016-10-12-at-4-48-47-pm

As you can see, you get a nice line chart, scaled for your data values (X axis) and the time they arrived (y axis). You can also see “Default” at the top left of the chart, indicating this is UI group “Default” – which is the group name we set in the configuration fields for the chart node.

If you look at the top left of the web page, you can see that we are, by default, on the home tab. If you had created your own tab then when you click the selector top left you’ll get a pull down menu of your tab options:

screen-shot-2016-10-12-at-4-52-40-pm

 

That was pretty simple, let’s add a few other UI elements to our dashboard. Firstly let’s create a gauge to show the last data value sent. Drag a Gauge node from the UI palette and wire it to the Random Number function node.

 

Then double click to open up and let’s configure it:

screen-shot-2016-10-12-at-4-56-16-pm

We’ll us the same Tab, home and we’ll also add it to the same group – “Default[Home]”. The Min and Max fields allow you to set the min and max values the gauge will shown. Make sure the max is set to 100 which is the most that the random number function node will generate. You can also change the Colour gradient to show different colours on the widget, but we will leave it as default for now.

Hit deploy and then head over to your dashboard and you’ll see that the chart and gauge are displayed in a group with the chart now showing the last 5 minutes of data and the gauge the latest value.

screen-shot-2016-10-12-at-5-01-16-pm

As a last example, let’s use a couple of the other UI nodes, a slider node and a text node to show the same data on a slider and as a text string.

screen-shot-2016-10-12-at-5-03-24-pm

 

For these two nodes, configure them to use the same tab – “Home” but use group name “anotherWidget”(You will need to click “Add new UI_group” from the drop down menu of the Group field, and then click the edit button). You will also need to change the min and max value for the slider node to show the correct position of the slider. Deploy those and let’s take a look at your dashboard. As you can see, we now have two widget groups, group “Default” with a chart and a gauge, group “anotherWidget” with a text filed and a slider. Simple eh?

screen-shot-2016-10-12-at-5-05-09-pm

In the dashboard tab beside your debug tab, you can also set the theme and order of the elements. If you don’t see the dashboard tab, click the menu button at top right corner, then select “View” -> “Dashboard”. You can see all the widgets and tabs showing in a tree structure, and you can easily drag the elements to change the orders that they are presented in the dashboard.

screen-shot-2016-10-12-at-5-10-31-pm

Now you’ve got the basics sorted out, play around with the different dashboard elements to build your own dashboards using some real world data – have fun!

 

Other approaches to dashboarding

If you are looking for more ideas on how to create dashboards using Node-RED, check out the dashboard lecture in our lecture series. It explores three approaches to dashboards – this approach using the built in dashboard nodes, the use of a third party dashboard tool – freeboard. And a generic approach that uses a javascript charting library and the http in/out nodes. All lectures are available at: http://noderedguide.com/


About Sense Tecnic: Sense Tecnic Systems Inc have been building IoT applications and services since 2010. We provide FRED, cloud hosted Node-RED as a service to the community. We also offer a commercial version to our customers, as well as professional services. Learn more.


How to Build a Great Chat Application With Node-RED and Websockets

In this guide you will learn how to use websockets in an HTML app. We will use FRED (cloud hosted Node-RED) to create a great chat application that uses websockets and does some simple message analysis. Continue reading “How to Build a Great Chat Application With Node-RED and Websockets”

How to Control Almost Anything With a Raspberry Pi 2 and Node RED.

In this guide you will learn how to control (turn them off or on) things based on data using Node RED on a Raspberry Pi. You will learn how to turn a fan on or off using a relay when the weather temperature raises above a level. Continue reading “How to Control Almost Anything With a Raspberry Pi 2 and Node RED.”

How to log Data by Pressing a Button on a Raspberry Pi, Using IFTTT, Node RED and Evernote.

In this guide you will learn how to connect your Raspbery Pi 2 to IFTTT.com via their Maker Channel. We will create a physical button that when pressed will log data to Evernote. We will use Node RED to program our Raspbery Pi, WoTKit for real-world data, and IFTTT to connect things together. Continue reading “How to log Data by Pressing a Button on a Raspberry Pi, Using IFTTT, Node RED and Evernote.”