Introduction

[00:00:00]
>> Hello friends, we're gonna talk about JavaScript and robotics. Typically, in the earliest days we wrote JavaScript in the browser, and then we were like, what if we did this in the server? And then we were like, what if we then also controlled hardware with it, right? And so we're gonna talk about kinda the different layers of that and how to kinda work with all these things.

[00:00:17]
And I will tell you right now, one of the focuses of this workshop is not just how do I do the standard Arduino stuff or whatever hardware stuff just with JavaScript. I think one of the themes that we're gonna kind of try to explore during this, is how do we take advantage of all three of those?

[00:00:37]
How do we take advantage of the fact that, yes, could you just write regular old Arduino sketches in JavaScript? You could. Could you write any old Node code? Of course you could, and browser code. But in so far that we have all three of those at our disposal, what new avenues and things does that open up for us, and what kind of ways can we explore and build on top of the three of those things together?

[00:01:03]
So it's not just necessarily about how do I, and yes, we will start with the hello world of Arduino, can we get an LED to blink? Yes, right. Okay, but what if we could also use that same technology, I don't know, to start a web server? And what also if we could use the same technology to add event listeners to buttons in the DOM?

[00:01:22]
And then how does that all kind of play together with some interesting browser APIs and stuff along those lines? So kinda like looking at the, not just how do we program in Arduino, but what are the unique things that we can do, given that we have all these various technologies at our disposal?

[00:01:38]
For this workshop, we're gonna use this Arduino R3 board. We, out of the box, literally, everything that you need, actually way more than you need, is in this Arduino starter kit as well. You can buy one of these, but you can also, we'll actually make a list of just the parts that we end up using in this workshop as well.

[00:02:00]
But if you get that kit, everything you need is in there. So this is the Arduino R3, but I will tell you that a lot of the other options work just as well. I've tried this on an Arduino Leonardo, which is kind of the even cheaper version of an R3.

[00:02:16]
I have tried this on the Arduino R4, everything works great. Even I've got over here, it's got some wires in it so I'm not gonna pick it up and lift it and show you, I've got an off-brand Arduino board as well. So the the nice part about the Arduinos, is that it is like the lingua franca of hardware, right?

[00:02:38]
[LAUGH] One would argue the jQuery or the React of hardware, right? And so it applies everywhere as well. The one caveat is that the Arduino has a few advantages. One, it's ubiquitous. Two, it's cheap, right? And it's just a general, like, Arduino R3 board will run you about $15.

[00:02:59]
Some of the other brand ones are even cheaper. And even the newer Arduino R4, it's, I think, $22, right? There are even cheaper options out there, there is an Arduino mini, most of these stuff works. The disadvantage is that the Arduino itself cannot run node on it, does need to be plugged into your computer, right?

[00:03:23]
There are a bunch of options, and we'll have a slide talking about this later, that there are a bunch of options that also will run Node. So let's say we did this on this thing called the Tehsil 2, this thing will run Node on it, it has an ethernet port, it has two USB, like outs as well as one in.

[00:03:41]
The disadvantage to this, is they don't make it anymore, [LAUGH], right? There are options out there, you can run a lot of this on a Raspberry Pi, the BeagleBone Black and some of the other BeagleBone products can run Node. And the nice part is, having looked at the previous version of this workshop, and kinda preparing for this new one, almost everything applies if you move to one of those platforms as well, right?

[00:04:10]
I had to rewrite very little of the code other than updating like just generally VARs to constant left because it was no longer 2017. And I could do stuff like that, and writing the odd async await occasionally, other than my own personal tastes. Everything we do today on the Arduinos can apply to any of these other platforms, but like I said, the huge advantages of the Arduino, it is cheap.

[00:04:33]
It is like by definition, the foundation for a lot of these things. So you know that you will always be able to probably get your hands on one, very easy. But should you be like, hey, I want something that can actually host the entire Node environment on it, there are some other options that come and go, but the actual concepts, all apply.

[00:04:51]
And the last time we didn't end up unplugging from the laptop anyway. So we've got the Arduinos as kind of the standard foundation. You can take in various different directions, everything applies in every direction. Can confirm, tried it out myself, can make promises. But let's talk about the Arduino R3.

[00:05:10]
And again if you have an Arduino R4, there's literally no difference at all, other than it happens to be a little faster and have a little bit more memory and stuff along those lines. But the actual layout and everything along those lines is exactly the same. Even with the Leonardo, the only real difference is it's a USB mini port instead of a full size USB port, right?

[00:05:32]
And on the R4, it's USB-C. So that's gonna be the major differentiator which is what dongle or adapter you need. But let's talk a little bit about the layout of the board itself. In this example, you've got the USB port. I don't need to explain that too much.

[00:05:49]
Along the top you have digital pins. Digital, 1s and 0s, ons and offs. You've got the microcontroller that's doing all the hard work in the middle there. And then along the bottom you have analog pens. These are for analog electric signals like turning, they read the amount of voltage coming through the circuit and allow you to program based on that.

[00:06:08]
And then towards the bottom you have just ground, 5 volt, 3.5 volts, or 3.3 volts, rather, and stuff along those lines. So very kinda simple set of general purpose input and output that we'll be using to kinda wire up most of our circuits today. Then let's talk about the kinda layers of software in our lives.

[00:06:31]
The basis here is, this is a screenshot of the Arduino IDE, which if you do not have you should download. Now we'll be using it in a little bit. Arduino IDE will basically find any Arduino you can put into your computer and allow you to upload code to it.

[00:06:52]
That said, the Arduino environment itself is what we can generally call a superset on top of C++. So for anything you do here, you will be writing C++, which as just a life choice, I've chosen not to do it more than I need to. So I'll be using it at the very beginning to do like the hello world to just get a feel of the Arduino.

[00:07:19]
And to load on some basic ways, should be able to load JavaScript and stuff along those lines. And eventually, towards the end, we'll just kinda look at the fact that these days, there are APIs in the browser that let you talk over serial to various pieces of hardware.

[00:07:35]
So we'll load on a little bit different firmware at that point as well. But if you've got starter kit, there's a book of projects in there as well, those are all using the regular Arduino C++. I'm not going to read a book to you. We're gonna kinda focus on the JavaScript part of this, but most things you'll see translate fairly easily in both directions as well.

[00:07:59]
But when it come down to, hey, web servers, or use websockets, or something along those lines, or send HTTP requests aboard, that is where we kinda get the full power of Node.js, and we will be able to leverage that as well. So we live in the JavaScript world on top of that.

[00:08:14]
That said, so then how do you run JavaScript on a board like this? There's a number of layers that kinda get you all the way there. And so let's kinda start, I think, closest to if you will, which is this library, which has been around forever, called Node Serial Port.

[00:08:36]
And this basically is a library that allows you to send serial messages to hardware. The most common in this case being an Arduino. It is incredibly low level. It is like you're sending packets and binary data back and forth. An option that you can use, but we'll talk about why you might not want to, because you could write your own abstractions, or the fact that the same team just gave you progressively more layers.

[00:09:07]
On top of that, we have Firmata.js. So Firmata is a set of firmware for an Arduino that kinda have generalized ways that you can talk to the board from not Arduino. So in this case, Firmata is a kind of, from the raw serial messages to more JavaScript methods that can send stuff to and from the board, we've got Firmata.js.

[00:09:28]
And the most of the methods on there are very similar to what you might see in Arduino, right? And so it is very close to that particular set of methods and stuff along those lines. And then built on top of Firmata.js is Johnny-Five? I think a great, I already used this analogy, but I'm just gonna reuse it cuz it's worth it.

[00:09:54]
Johnny-Five is like, if you think about just a regular DOM manipulation, like pre jQuery, right? And having to remember stuff about, Internet Explorer needs this, eventually work like this in an explorer, but in Firefox they work like this. And all of those details, Johnny-Five is the jQuery for all of that.

[00:10:14]
Which is Johnny-Five when I talked about all the code that we wrote works across a lot of different boards, including ones that are no longer even made. Johnny-Five is the kind of abstraction layer over that. So it gives you the ability to write a lot of these things, and then like, okay, I'm not gonna use an Arduino board, I'm gonna use an old Tehsil 2 that I have around, you just swap out.

[00:10:37]
Just say, hey, I'm gonna use the Tehsil 2, and Johnny-Five is like, cool, I know what to do here, don't worry about it, everything's gonna be okay. So it gives you a lot of just very convenient easy ways to interact with your boards on top of the other two libraries that we saw earlier.

[00:10:52]
Like I said BeagleBones, Raspberry Pi's, there's even various different you can actually hook an Arduino up to these like various different shields. So a lot of this stuff will apply to any other platforms that you may choose to use. We won't use this one today, but I think it's really cool.

[00:11:10]
My friend, Suze, made this library called AVRGirl, which is just a library that you can take Arduino sketches and load them onto devices with Node as well. At this point, we're just gonna hit the Upload button in Arduino cuz it's very easy for us, and we're only gonna need to do this once or twice, but it is a super cool library.

[00:11:27]
It's also got experimental support for what we'll see towards the end just as a little taste, which is just looking at the web serial API. Like I said before, it lets you control some of the stuff from the browser. But basically it allows you to kind of just load sketches on and have all that at your disposal.

[00:11:43]
And like I said, the web serial API, I wouldn't build production apps on top of it, right? Cuz can I use support isn't great, but I think it's still an experimental API for the most part, but it does let you send serial messages and do a lot of this stuff without Node, right?

[00:12:00]
So more like JavaScript bots cuz you can literally open up Chrome, connect to, in this case an Arduino, but also other stuff. I have a guitar pedal that's registered with my computer for serial messages over Bluetooth, and it showed up on the list of things that I could theoretically talk to from my web browser.

[00:12:18]
And so being able to do all that from the browser is also incredibly cool, as you can see, incredibly experimental, but very cool at the same time.