Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Physical JavaScript with Johnny-5, Cylon and Te...
Search
mulderp
September 24, 2014
Programming
1.1k
1
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Physical JavaScript with Johnny-5, Cylon and Tessel
A small overview on the current state of JavaScript for physical computing
mulderp
September 24, 2014
More Decks by mulderp
See All by mulderp
Node.js for Embedded Systems
mulderp
1
2.8k
Nodebotsday
mulderp
1
150
I2C basics with Arduino
mulderp
0
240
Sharing hardware with JavaScript
mulderp
1
240
Arduino October meetup
mulderp
0
140
Blogging and writing about JavaScript
mulderp
2
960
Minimum Viable Interactions
mulderp
3
640
Arduino July Meetup
mulderp
0
120
Handlebones
mulderp
0
240
Other Decks in Programming
See All in Programming
jQueryをバージョンアップする前に使いたいjQuery Migrate
matsuo_atsushi
0
610
作って学ぶ、 JSX (TSX) ランタイムの基本
syumai
7
1.7k
脅威をエンジニアリングの糧にして――現場編 / Turning Threats into Engineering Fuel — Field Edition
nrslib
0
310
A2UI という光を覗いてみる
satohjohn
1
160
ローカルLLMを使ってB2Bサービスを作っていての学び
yaotti
0
220
Datadog LLM Observabilityで実現する 安全なLLM Usage 管理
3150
0
120
Performance Engineering for Everyone
elenatanasoiu
0
240
技術記事、 専門家としてのプログラマ、 言語化
mizchi
13
6.6k
Inside Stream API
skrb
1
810
さぁV100、メモリをお食べ・・・
nilpe
0
160
TSKaigi Night Talks 2026_TypeScriptでサプライチェーンの整合性を型に閉じ込める
geekplus_tech
0
420
技術的負債解消で開発者の未来を開く- AIの力でコード刷新
kmd2kmd
0
120
Featured
See All Featured
The Organizational Zoo: Understanding Human Behavior Agility Through Metaphoric Constructive Conversations (based on the works of Arthur Shelley, Ph.D)
kimpetersen
PRO
0
370
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.6k
Accessibility Awareness
sabderemane
1
150
Marketing Yourself as an Engineer | Alaka | Gurzu
gurzu
0
250
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
2k
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.2k
Reflections from 52 weeks, 52 projects
jeffersonlam
356
21k
Why You Should Never Use an ORM
jnunemaker
PRO
61
9.9k
実際に使うSQLの書き方 徹底解説 / pgcon21j-tutorial
soudai
PRO
201
75k
Statistics for Hackers
jakevdp
799
230k
How to Think Like a Performance Engineer
csswizardry
28
2.7k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
46
2.9k
Transcript
Physical NodeJS! with Johnny-5, Cylon and Tessel Patrick Mulder @mulpat
Munich Node JS User Group September 2014
https://www.flickr.com/photos/spelio/13884611917
ngraph http://anvaka.github.io/talks/jsfest/presentation
maker labs https://www.flickr.com/photos/leesean/3098869562
Source: Sander Arts, Atmel
“inspecting” your car https://vimeo.com/84498522
new browser controls https://www.flickr.com/photos/frenchhope/317111231 https://www.flickr.com/photos/bagogames/14073389239
example: blinking http://makezine.com/2014/05/29/10-ways-to-make-your-robot-more-humanlike/ “The average human blink rate is about
17 blinks per minute.” (ca. 3 blinks/s) “The normal length of a blink is 100-400 milliseconds”
Arduino! 1x1
Arduino UNO MPU Digital Pins Analog Pins USB Power Pins
a “typical” project configuration blocking! code Processing IDE sketch
Embedded Code void setup() {! pinMode(led, OUTPUT);! }! ! void
loop() {! digitalWrite(led, HIGH);! delay(300);! digitalWrite(led, LOW); ! delay(2700); ! }
blink == blocking ? void loop() {! ! blink();! !
check_network();! move_something();! wait_for_input();! write_to_file();! }
–Eric Lippert “The by-design purpose of JavaScript was to make
the monkey dance when you moused over it. ” http://programmers.stackexchange.com/a/221658/4723 JavaScript
How would you write this with JavaScript ?
blink = function() {! led.toggle();! setTimeout(blink, 2700);! }! ! blink();
setTimeout(…)
setInterval(…) setInterval(function () {! led.toggle();! }, 2700);
https://github.com/rwaldron/johnny-five Johnny-5 API
Johnny-5 API this.repl.inject({! board: this! }); https://github.com/rwaldron/johnny-five/tree/master/docs led.fadeIn(); led.blink(100); //
or led.strobe() led.color(keymap[key.name]);
demo johnny-5 http://www.flickr.com/photos/tronixstuff/5268597956/
How can Arduino speak JavaScript ?
Firmata protocol “The aim is to allow people to completely
control the Arduino from software on the host computer.” http://www.firmata.org/wiki/Main_Page
firmata sketch
firmata test
control flow led = new five.Led({! pin: 13! });! !
led.on();! ! this.wait(2700, function() {! led.on();! }); JavaScript https://www.flickr.com/photos/nate/3081263606 Firmata /! serial port Arduino
Network? This means Arduino Yun…
None
Yun architecture
acts-as-webserver http://www.open-electronics.org/interact-and-remotely-control-arduino-yun-with-ajax/#
For developer, OpenWrt is the framework to build an application
without having to build a complete firmware around it + embedded host
Cylon.js http://cylonjs.com/
Cylon.js
led blinking var Cylon = require('cylon');! ! Cylon.robot({! connection: {!
name: 'arduino',! adaptor: 'firmata',! port: '/dev/ttyACM0'! },! ! devices: [! { name: 'led', driver: 'led', pin: 13 },! { name: 'button', driver: 'button', pin: 2 }! ],! ! work: function(my) {! my.button.on('push', function() {! my.led.toggle()! });! }! }).start();
http://www.slideshare.net/TechnicalMachine/tessel-the-end-of-web-development-as-we-know-it Tessel is a microcontroller that runs JavaScript. It's npm-compatible
and ships with Wifi built in. Use it to easily make physical devices that connect to the web. http://www.slideshare.net/TechnicalMachine/fluent-20-min-32416115
How does it work? today tomorrow
Blink first var tessel = require('tessel');! ! var gpioA =
tessel.port['A'];! ! var led1 = gpioA.digital[0];! ! var value = true;! setInterval(function () {! led.write(value);! value = !value;! }, 2000);
physical JavaScript is fun :) still in early stages dedicated
platforms emerge
Thanks! http://blog.farsinotare.com https://oshpark.com/shared_projects/ZsQu0dA9 https://www.kickstarter.com/projects/311408456/rgb-123-led-matrices
None
None
https://iotroadshow.intel.com/de/home/