Techspeakers say hi

Hello SF All-hands!! 🦊

Last updated: 2018-06-12

Flaki, tinkering

István Szmozsánszky "Flaki"
@slsoftworks

Mozilla DevRel

Developer Outreach / DevRel

Mozilla TechSpeakers

Mozilla TechSpeakers

JavaScript

JavaScript developer/trainer

Microchips & JS

2,560 bytes

ought to be enough for anyone

a.k.a  JavaScript 💖 Hardware

István Szmozsánszky "Flaki"
@slsoftworks

Embedded JavaScript

The Espruino Pico

Early adopters: the Espruino

Initially with JS supporting microcontrollers, ecosystem-compatibility (see: standards) wasn't a priority

Standards support used to be bad but improved a lot and now it's "good enough". Espruino has been ported to several other devices since, one of the most well-known is the ESP 8266 which is a wifi-enabled microcontroller board!

Embedded JS standards support: JerryScript

JerryScript can run on devices with less than 64 KB RAM and <200 KB of flash, it is fully ES5.1-compliant & heavily optimized.

It took Samsung a year to complete the initial version of JerryScript, which they subsequently open-sourced and released to the public. It took about another year for the codebase to stabilize, but today it's one of the best (and most widely adopted) embedded JS engines besides Espruino (especially with companies building their own embedded products, such as…)

The Micro:bit MakeCode visual editor

Embracing the web: BBC Micro:bit

The MakeCode Editor is a completely browser-based online editor for creating new sketches (firmware code) for the Micro:bit. It lets you code in JavaScript, or use a simple block-based language to create the functionality, and even generates the firmware that just needs to be downloaded and copied over to the device.

Rocky.js: familiar APIs in a small form factor

Pebble: performant JavaScript on a watch!

Pebble managed to run a JS/HTML5 watchface, powered by JerryScript without it being less efficient than the C code!

…and Fitbit took over right where Pebble left off

16 Mhz 8-bit CPU, 2.5 Kilobytes of memory, 32 Kilobytes of program storage!

Learning how to code

[]()

The Arduboy

So we will see how to put JS on these

Some tiny JS engines get pretty close, but still no match for these resource-constrained devices. You'll need something of a very different approach.

Create games with the Arduino IDE

So what is Clouduboy?

Clouduboy is a lot of things. A library for creating tiny pixelgraphic images (PIF) and games (MicroCanvas). An online IDE for Arduino-based gaming devices. A compiler to turn JavaScript games to C++ ones and put them onto those tiny microcontrollers

Create games!

Well, rather something more like this:

Share them!


MicroCanvas
</details

…and then put them in your pocket!

Learn to code

Create whole games in the browser!

Built-in editing tools

Turn it into Arduino code

So it will run on this…

The Arduboy is based on the same chipset and peripherals than the one you just saw. It just looks nicer ;)

…or even this!

The Tiny Arcade is slightly different. It has a much more powerful ARM MCU (same as the Micro:bit!) & color screen!

Experimental Micro:bit support!

The Micro:bit is interesting because it only has 2 buttons (space invaders requires at least three, to move and shoot) but it has built-in accelerometer - Clouduboy uses the device tilt as directional buttons!

It's Just The Web!

cld.by/dino

cld.by/mozillaid

cld.by/invaders

Thanks a bunch!

talk.flak.is/play/sfallhands

Clouduboy @clouduboy

Flaki @slsoftworks

Keep playing!

Reading list: