Transcript

• 1. HTML5/JavaScript ではじめるIoT MOONGIFT 中津川篤司
• 2. 自己紹介 2 @moongift fb.me/moongift.fan 中津川 篤司 株式会社MOONGIFT 代表取締役 ニフティクラウド mobile backend           エヴァンジェリスト 2004年1月よりオープンソース・ソフトウェアを毎 日紹介するブログ MOONGIFT を運営。 http://www.moongift.jp/ hifive エヴァンジェリスト
• 3. 0x10年前 4
• 4. 2015年 5 ・Arduino ・Raspberry PI ・Intel Edison ・mbed ・konashi
• 5. ネットワーク×デバイス 7
• 6. 何をするか？
• 7. Raspberry PI買った！ → Lチカしてみた Arduino買った！ → Lチカしてみた mbed買った！ → Lチカし（ry Intel Edison買った！ → (ry
• 8. 何を買ったではな く、何をするか？ つまり表現大事
• 9. 表現に必要なモノ • マイコン • インプット（センサー） • アウトプット
• 10. アウトプットと言えば？
• 11. 処理する言語と言えば？
• 12. なんでHTML5/JS？ • 今回のテーマだから • CORS問題（XMLHttpRequest2） • Canvas/WebGL • WebSocket/WebRTC • node.js（特にBTE系）
• 13. JavaScriptサポート • Raspberry PI（node.jsサポート） • Intel Edison（node.jsサポート） • Pebble（CloudPebble） • BeaconEgg（iBeacon） • Konashi（konashi.js）→デモ • IRKit（IRKitjs）
• 14. Canvas https://www.youtube.com/watch?v=GGPIk8F5wOs
• 15. iOS/Androidアプリ化 • PhoneGap/Cordova/Monaca • アプリカン ReactNativeでブレイクするかも？
• 16. ポケットミク http://otonanokagaku.net/nsx39/appli/01/ http://www6.plala.or.jp/TimeTripper/nsk39/ mikublock.html
• 17. WebGL • MozVR • Unity5  WebGLサポート（まだプレビュー） http://mozvr.com/
• 18. IoTの3大要素 20 IoTデバイス データストレージ センサー/出力
• 19. センサー • 照度 • カメラ • 温度 • 湿度 • Felicaリーダー • ボタン 21 正直微妙… もっと面白いセンサーが 欲しい！
• 20. 出力 • LCD • LED • コンピュータ • hue 22 もっと微妙
• 21. 23 https://www.youtube.com/watch? v=YUUsJSDa7PE
• 22. Arduino module • ArduinoとLittleBitsを連携させるためのモジュール
 ↓ • LittleBitsのIOを持ったArduino互換モジュール （Leonardo） 24 https://www.youtube.com/watch? v=FXQ9d3qJt3Q 39.95ドル！
• 23. CloudBit module • Arch Linux搭載のモジュール • 改造するとSSHができます • LittleBits Cloud Controlで外部操作可能（WebSocket） 25 59.95ドル！
• 24. その他入力系/出力系
• 25. http://control.littlebitscloud.cc/ デモ
• 26. ボタンを押すとプッシュ通知 28 var pin4 = new m.Gpio(4); pin4.read();
• 27. IoTの3大要素 29 IoTデバイス データストレージ センサー/出力
• 28. よくない利用 30 IoTデバイス デスクトップ スマートフォン Webサーバ
• 29. よくない利用 31 デスクトップ スマートフォン
• 30. サーバを間に挟みましょう 32 IoTデバイス デスクトップ スマートフォン サーバ SDK REST API IoTデバイス もあるよ！
• 31. IoTの問題2 33 IoTデバイスに何かあった時、通知したい 今ならプッシュ通知がスマート  → APNs、GCMに接続する必要あり  → デバイストークンの管理
• 32. よくない利用 34 IoTデバイス スマートフォンAPNs/GCM  デバイストークンの管理 通信手段
• 33. 35 サーバを使った例 IoTデバイス スマートフォンAPNs/GCM ！ サーバ HTTP/HTTPSアクセス もあるよ！
• 34. プッシュ通知を使った例 36
• 35. var NCMB = require("./ncmb").NCMB; NCMB.initialize( APP_KEY , CLIENT_KEY"); function sendPush(high, value) { NCMB.Push.send({ "immediateDeliveryFlag": true, "message": high ? "電気がつきました" : "消灯しました", }, { success: function() { console.log("Successful!"); // 成功 }, error: function(error) { // エラー console.log("Failed"); } }); }
• 36. 対応プラットフォーム 38 Objective-C
 （2014年12月より64bit対応） Android JavaScript
 （2014年12月よりnodeサポート！） Unity
• 37. まとめ • マイコン、インプット、アウトプットともに材料は 既に っている • 表現場所としてHTML5は手軽（作り手、閲覧者と もに）。ただし高度な表現はCanvas/WebGLの習 得必須 • JavaScript（node.js含め）は必修