JSDC Build Anything with JavaScript

2. JavaScript 速度 x 100 倍

3. JavaScript 速度破表

4. JavaScript 速度破表

5. JavaScript 速度破表

6. JavaScript 統治了 Web 平台

7. JavaScript 跑到後端

8. JavaScript 跑到後端

9. Raspberry Pi @@

10. NodeJS 跑到 Raspberry Pi

11. NodeJS 跑到 Raspberry Pi

12. Arduino 串接感測器，收集資料上雲端

13. Internet of Things ( IoT )

14. 能否放到 Arduino 裡面呢?

15. Internet of Things ( IoT )
Flash Memory 32KB
SRAM 2KB
EEPROM 1KB
Clock Speed 16 MHz

16. 能否放到 Arduino 裡面呢?

17. 能否放到 Arduino 裡面呢?

18. Arduino Yun (雲)

19. Arduino Yun (雲)

20. 另一種選擇... Arduino Firmata

21. 設定指定腳位的功能Arduino Firmata
Byte Array 0xF4 0x0D 0x01

22. 0x91 0x10 0x00Byte Array
設定13腳輸出Arduino Firmata

23. F4
0D
03
91
1000

25. 目前支援的程式語言Arduino Firmata

27. 用 Webduino 玩轉 Arduino
- Open Source
- MIT License
- 運行環境
- Browser
- NodeJS
- 通訊方式
- USB / WiFi
- 支援Blockly開發工具
- JS Code generator

28. NodeJS
Arduino Firmata

29. Chrome + ChromeApp + Serial Port
Arduino Firmata

30. Webduino
Blockly

31. Blockly → JS → Browser / NodeJS
Arduino Firmata

32. Blockly → JS → Browser / NodeJS
Arduino Firmata

33. Blockly → JS → Browser / NodeJS
// require('webduino-blockly');
var dht;
boardReady('3qad', function (board) {
dht = getDht(board, 11);
dht.read(function(evt){
window.alert(dht.temperature);
}, 1000);
});
Arduino Firmata

34. 更小更便宜?
行動
電源

35. 更小更便宜?
行動
電源

36. ESP8266 誕生 !
ESP8266 Features
● 802.11 b/g/n protocol
● Wi-Fi Direct (P2P), soft-AP
● Integrated TCP/IP protocol stack
● +19.5dBm output power in 802.11b mode
● Integrated temperature sensor
● Power down leakage current of < 10uA
● SDIO 2.0, SPI, UART
● STBC, 1×1 MIMO, 2×1 MIMO
● …

37. 直接用 HTML控制 LED
<wa-led id='led' pin='10' state='off'>
</wa-led>

38. 直接用 HTML控制 LED
<wa-led id='led' pin='10' state='on'>
</wa-led>

39. WebComponents → WS/MQTT → Firmata
<web-arduino id='board' >
<wa-dht id='dht' pin='10'></wa-dht>
</web-arduino>
dht.read( function (evt) {
var show =
"<br>溫度:" + evt.temperature + " ℃
<br> 溼度:" + evt.humidity + " %";
}
, 1000);

40. WebComponents → WS/MQTT → Firmata
<web-arduino id='board' >
<wa-ultrasonic id='snd' trig='11'
echo='11'></wa-ultrasonic>
</web-arduino>
snd.ping(
function (cm) {
var show = "距離:" + cm + "公分";
}
, 1000);

41. 感測資料可以先經由RP2處理再上雲端

42. HTML JS CSS
http
tcp/ip
websocket
mqtt
mqtt
Arduino Firmata
傳輸架構

43. 溫濕度結合 Google Chart 即時顯示

44. Webduino 馬克一號韌體升級啦~
Ver 1.0 Ver 1.5

45. Webduino 馬克一號 ver 1.5

46. Webduino 馬克一號 Ver 1.0
Arduino
ESP8266

47. Webduino 馬克一號 Ver 1.5
Arduino
ESP8266

48. 天上飛的~

52. 地上跑的~

53. 地上跑的~

55. 遙控車的控制方式 - 前輪

56. 遙控車的控制方式 - 後輪

57. 連接小威開發板
轉接訊號線
焊接控制線

60. Web 的威力

61. Webduino 馬克一號 Ver 1.5
Arduino
ESP8266

62. 其實應該是這樣
Arduino
ESP8266
JavaScript

66. 視頻遙控車

67. 相關資源
● UV4L WebRTC
● tracking.js
● raspi-webRTC
● 用JavaScript實現人臉追蹤

68. 電源開關
充電孔
升壓板

74. 前進
前進停止 後退停止
後退

75. 超簡單實現三軸控制

76. Web 的威力

77. F4
04
0B
00
F7
自訂命令

78. 自己感測器元件自己包
10月底前釋出
Arduino Firmware

79. webduino