Want to start Innovating with Arduino, Raspberry Pi and Internet of things (IoT) ? Click here to learn about our July 2017 training

Arduino using node.js

Posted by Momen 15/07/2017 0 Comment(s)

This tutorial is looking to starting with Arduino using Node.js and prototyping an Internet of Things application using PubNub’s JavaScript APIs.

          Overview

 

Johnny-Five: JavaScript Robotics Framework

Is a JavaScript Robotics programming and open source platform and has growing developer communities.

 

Let’s get started with Johnny-Five to program the Arduino

 

You need Hardware and software components.

Hardware:

  1. Arduino Uno
  2. LED
  3. breadboard
  4. jumper wires
  5. resistor (220 Ω)

 

Software:

  1. Arduino IDE
  2. Node.js

 

             Implementation

First you have to download Arduino IDE before getting started and install it to your Laptop, then connect your Arduino to the Laptop via USB cable.

 

On Arduino IDE, go to Tools > Port and choose Arduino Uno to make sure that you connect to Arduino Uno.

Johnny-Five communicates with Arduino using the Firmata protocol, so you need to install StandardFirmata to do so follow the following steps:

 

  • On Arduino IDE, open File > Examples > Firmata > StandardFirmata.
  • Click the upload button (arrow button).
  • Wait until the IDE message window says “Done uploading”.
  • Now your Arduino are ready for start coding.

 

Make sure Node.js are installed on your Laptop. Open the command prompt and type js-hello, and then cd into the command and install Johnny-five using the npm package manager.

 

$ npm install johnny-five

 

Now, let’s write Hello World with Johnny-Five. Since you’ve got some shiny hardware, you’re going to create the “Hello world” of hardware, which is a blinking LED light!

 

Connect the components as the figure bellow:

 

led-circuit

 

Blinking an LED with Johnny-Five

Create a file, blink.js, and paste the code below:

var five = require('johnny-five');

var board = new five.Board();

board.on('ready', function() {

  var led = new five.Led(13);

  led.blink(500); =

});

Run:

$ sudo node blink.js

 

Now the LED should blink, if not check the circuit or the code.

You have learned the basics, so let’s go further and learn how to make your hardware talk to the Internet and make your first smart device.

 

Internet of Things with JavaScript

Here you are going to connect Arduino to internet, unlike Bluetooth, that mean you can control it from anywhere, this way is named IoT (Internet of Things), To make communicating with a socket connection easy, we will use the PubNub JavaScript API.

PubNub Data Stream Network (DSN) provides global infrastructure, build secure real time Mobile, Web, and IoT Apps, and allows you to scale real-time apps and IoT devices quite easily.

For example, when a user in Dubai is controlling an Arduino in London:

 

  • The user can write a message, “Make the light green”, from a mobile phone.
  • The message is sent to a data center in Dubai.
  • The data is synchronized across all the data center.
  • The Arduino subscribes the data from London data center, and changes the light color.

In this tutorial, you’re going to make a simple project using IoT, but first you need the following Hardware components:

  1. Arduino Uno
  2. RGB LED (Common cathode)
  3. Breadboard
  4. Jumper lead wires
  5. Resistor (220Ω x 3)

RGB LED: means red, blue and green LEDs. RGB LED products combine these three colors to produce over 16 million hues of light, some colors are “outside” the triangle formed by the RGB LEDs. Also, pigment colors such as brown or pink are difficult, or impossible, to achieve.

 

Connect the components as the figure bellow:

 

rgb-circuit

Now, you are going to build a web interface to control the LED.

 

Use the HTML5 element <input type="range"> to draw a slider bar to let a user to change the value of each “R”, “G”, and “B”. Each color has the values of 0 to 255 (min="0" max="255") and uses only integer values by setting the increment by 1 (step="1").

Type following commands to controls the red color.

<input id="red" type="range" min="0" max="255" step="1" value="0">

Get your API keys by typing:

<script src="//cdn.pubnub.com/pubnub-3.7.18.min.js"></script>

Then write:

 

var pubnub = PUBNUB({

subscribe_key : 'you_subscribe_key',                         

 publish_key   : 'your_publish_key'

});

Let’s send data to change the color of the RGB LED.

Listen to the change event of the slider DOM, and send any changes to PubNub with the publish method.

var red = document.getElementById('red');

red.addEventListener('change', function(){

  pubnub.publish({

    channel: 'smart-led',

    message: {color: 'red', brightness: +this.value}

  });

}, false);

Note: You can name the channel any name you want, but remember to use the same name when you receive the data later.

Then you are going to use Node.js to receive the data with hardware.

 

To turn on RGB LEDs with Johnny-Five. You have to install johnny-five with npm, write this code below:

 

var five = require('johnny-five');

var led;

five.Board().on('ready', function() {

  console.log('ready');

   led = new five.Led.RGB({

    pins: { // pin numbers

      red: 6,

      green: 5,

      blue: 3

    }

  });

  // test

  led.color({red: 255, blue: 0, green: 0});

  led.on();

});

Now notice the LED it should turned on, if not check the circuit or the code.

Next, you’ll dynamically change the value using the data sent from the browser UI.

To receive the data, use the PubNub subscribe method.

Install pubnub using npm:

$ npm install pubnub

 

Initialize the instance, just like the browser-side code:

var pubnub = require('pubnub').init({

  subscribe_key: 'your_subscribe_key',

  publish_key:   'your_publish_key'

});

You can read the data by accessing the same channel that you are sending the data from. Once the data is received, the callback function is called, so you can reflect the value to the LED.

 

pubnub.subscribe({

  channel: 'smart-led',

  callback: function(m) {

    if(led) {

      r = (m.color === 'red') ? m.brightness : r;

      g = (m.color === 'green') ? m.brightness : g;

      b = (m.color === 'blue') ? m.brightness : b;

 

      led.color({red: r, blue: b, green: g});

      console.log( 'color change to...' );

      console.log( led.color() );

    }

  }

  error: function(err) {console.log(err);}

});

Leave a Comment