How to control your Arduino with JavaScript

Arduino boards are one of the easiest ways for programmers to hack hardware. There is a huge amount there to suit just about anyone with programming experience. However, the beginning can seem intimidating for those who are short on time.

Learning a brand new language language just to try out a microcontroller, it might seem like a lot of work. What if you want to start playing with home electronics in a programming language you already know? Good news: you can!

We have already shown you how to control the Arduino board with Python control the Arduino with Python control the Arduino with and today we’re going to show you how to do the same with JavaScript. Instead of a simple basic LED flashing tutorial, today we will be using the Johnny-Five environment to control a servo with a computer keyboard, all programmed in JavaScript.

Equipment list

For this project you will need:

• Arduino Uno (or compatible board. board): $22 from the official store, although you can buy them cheaper clone boards are available for just $3.20 on AliExpress.
• Hobby Servo: Any Arduino compatible servo from a hobby store will do, I use a $1.60 servo from AliExpress.
• A couple pieces of wire
• USB cable: to connect Arduino to your computer

Today’s tutorial will use an Arduino Uno board. The Johnny-Five IDE we’ll be using later in this project supports most Arduino-compatible microcontrollers, although your board must have PWM capability to keep the servo running.

Schema setup

Attach your servo to your Arduino like this:

Briefly, the VCC line ( RED ) connects to the Arduino’s 5V pin, the GND line ( BLACK or BROWN ) is connected to the GND pin of the Arduino, and the impulse line ( yellow or orange ) is connected to Arduino pin 10. Note that although you don’t need to specifically connect it to pin 10, it must be connected to the PWM pin, usually labeled ~ .

Double check that you have not mixed up the wires and connect the Arduino to your computer. We will be using Windows 10 for this project. All elements of this project are also available for Mac and Linux, although some installation instructions may vary slightly.

If you haven’t already, download the Arduino IDE and select » Board and Port» on the menu » Tools» . If you’re doing this for the first time and it’s all a bit of a mystery, our Arduino Beginner’s Guide can help you with these steps.

Once you connect it, download the sample sketch StandardFirmataPlus on the desk. You can find this sketch in the menu File in section Examples> Firmata> StandardFirmataPlus . You don’t need to change the sketch at all, it just sets up the Arduino to wait for external instructions that we’ll provide later.

JavaScript Robotics with Johnny Five

The framework we’ll be using to control our Arduino with Javascript is called Johnny-Five. Not surprisingly, given the title of the film, the project is focused on working with robotics.

To install Johnny-Five we must first install Node.js . You can download their latest build from the Node.js site. We use the recommended release, which at the time of writing is 8.9.4 LTS .

Open file .msi and follow the installation instructions, making sure it is added to your PATH variable . The current Node.js installer adds PATH as standard, though it’s worth checking this during installation as it’s required for our next step.

Once the installation is complete, we will have access to Node Package Manager (NPM) from the Windows Command Prompt (CMD). Click Start and type cmd. Before we continue, we need to initialize NPM to prevent possible installation errors. No special knowledge required, just type:

npm init 

Follow the instructions on the screen. For today’s project, you don’t need to change anything, just press enter until you’re back at the command line, then type:

 npm install johnny-five 

This will install all the important packages that will be discussed with our Arduino. We need one more thing to make this project work, it’s a package Keypress which will allow us to read keystrokes from the keyboard.

Install it by typing:

 npm install keypress 

With all of these packages installed, we are ready to code!

If you encounter any issues during installation, try running the johnny-5 installation again after settings by pressing a key. This may just be a quirk of the version of NPM being used here, but it now prevents a problem you’re likely to run into later like me.

The code

Today we will be using the example code provided in the johnny-5 documentation which allows us to control our servo using the arrow keys on the keyboard. The complete code is available at johnny-five.io, but we’ll take a closer look at it here to fully understand how it works.

We use Eclipse IDE about coding today though you can use any IDE or text editor about this project.

Create a new file and name it test.js and save it somewhere you can easily access from the command line later. The script starts by creating variables for the required libraries and initializing the library Keypress to listen for incoming data as well as call a method Board() to set up the board.

 var five = require("johnny-five"); var keypress = require("keypress"); keypress(process.stdin); var board = new five.Board(); 

Please note that the board configuration is automatic here, you do not need to specify ports. If you have a specific port setting configured, or if you’re just unlucky with auto-detection, you may need to specify the port explicitly.

Next, we want to wake up our board and set it up for servo control. board.on call waits until the Arduino pins are ready before moving on. The johnny-5 library has native support for servos and we call Servo Continuous (10) on pin 10 for direct control.

 board.on("ready", function() { console.log("Use Up and Down arrows for CW and CCW respectively. Space to stop."); var servo = new five.Servo.Continuous(10); process.stdin.resume(); process.stdin.setEncoding("utf8"); process.stdin.setRawMode(true); 

Challenges process.stdin guarantee that all the data we receive from the keyboard will be used in the next block of code. Now we want to «listen» for keystrokes and use them to move our servo clockwise (CW), counterclockwise (CCW) or stop on its tracks.

  process.stdin.on("keypress", function(ch, key) { if (!key) { // if no key is pressed, return ie do nothing. return; } if (key.name === "q") { console.log("Quitting"); process.exit(); } else if (key.name === "up") { console.log("CW"); servo.cw(); } else if (key.name === "down") { console.log("CCW"); servo.ccw(); } else if (key.name === "space") { console.log("Stopping"); servo.stop(); } }); }); 

Make sure you include all the closing brackets at the bottom and refer to the entire block of code as above if you encounter any errors. Save this script and open a command prompt.

Waving hello!

Now change to the directory where you saved your script and run it by typing:

 node test.js 

The program should run immediately with the board information before giving you the instructions given in the code. Try pressing the up and down arrow keys, spacebar and Q, to leave. The screen should look like this: