Node-RED でデバイス・アプリ連携(ローカル通信もネット経由も) / TECH Street _ Node-RED
by
you(@youtoy)
Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
Node-RED でデバイス・アプリ連携 (ローカル通信もネット経由も) 2021年5月27日 (木) TECH Street @オンライン 豊田 陽介 ( @youtoy )
Slide 2
Slide 2 text
豊田陽介(@youtoy) 自己紹介 普段は、某通信会社の研究所勤務 自宅に各種デバイス等 がたくさん ビジュアルプログラミング・ IoTなどのテーマ関連 ガジェット好き その他 IT系イベント主催・運営、登壇なども、 子ども向けの活動いろいろ(IT系以外も) プライベートでの活動
Slide 3
Slide 3 text
今日の話はNode-REDで デバイス連携
Slide 4
Slide 4 text
デバイス間をつなぐ仕組み・できること ・HTTPリクエスト ・Websocket ・MQTT デバイス間で直接 ネット経由 ・シリアル通信 ・BLE ・MIDI つなぐ 仕組み できる こと ・既製品のデータ取得 (温湿度計など) ・電子工作デバイスで のプロトタイピング ・○○を検知したらLINE ・Slack等に通知 ・スマートホームの 仕組みを自前で作る Node-RED で利用可能なものの例(いろいろある中の一部)
Slide 5
Slide 5 text
PCを使い、まずは多機能な デバイスと組み合わせて プロトタイピングしてみる
Slide 6
Slide 6 text
例えばBluetooth搭載デバイスとの間で 温度 25.1℃ 湿度 56% M5Stack+センサー PC 部屋の環境モニタ センシング 可視化
Slide 7
Slide 7 text
具体的なフロー(プログラムの部分)
Slide 8
Slide 8 text
具体的なフロー(プログラムの部分) 値の取り出し、 グラフ化 BLE接続、データ取得など データ変換
Slide 9
Slide 9 text
デモ動画(温湿度のグラフ化)
Slide 10
Slide 10 text
テキストプログラミング でもできますが
Slide 11
Slide 11 text
Node-REDで手軽に実現 JavaScript の例 Node-REDの例 GUI上でボタン 操作・文字入力 で進める BLE の処理の流れ を把握しつつ プログラミング
Slide 12
Slide 12 text
さらに仕組みを追加するのも手軽に 温度 25.1℃ 湿度 56% M5Stack+センサー PC 部屋の環境モニタ センシング 可視化 スマホアプリ通知 スマホ インターネット 経由
Slide 13
Slide 13 text
やりとりの仕組みを 別のものにしてみる
Slide 14
Slide 14 text
インターネットを経由させるように変更 デバイス +センサー PC 無線(BLE) デバイス +センサー (多地点) PC インターネット経由 MQTT ブローカー リアルタイム 通信(MQTT) 近距離無線 遠隔地間での通信
Slide 15
Slide 15 text
接続方法を変えるのも手軽に デバイス +センサー PC 無線 (BLE) デバイス +センサー PC 有線 (シリアル通信) BLE非対応 デバイス BLE対応 デバイス
Slide 16
Slide 16 text
実際に作ってみると(人感センサー利用) デバイス +センサー (多地点) PC インターネット経由 MQTT ブローカー リアルタイム 通信(MQTT) 画面表示 フロー
Slide 17
Slide 17 text
具体的なフロー(プログラムの部分) MQTTブローカーとの 接続、データ処理など 場所 A 場所 B 可視化
Slide 18
Slide 18 text
別アプリの制御にも
Slide 19
Slide 19 text
デモ動画(OBSのアプリ外からの制御)
Slide 20
Slide 20 text
デバイス関連の補足
Slide 21
Slide 21 text
【デバイス】 ・M5Stack関連 ・obniz 連携できるデバイス・アプリの例 たくさんの種類がある中で利用したことがあるものの一部 デバイス内/ローカル インターネット経由 【デバイス】 ・micro:bit ・toio ・M5Stack関連 ・MIDI対応デバイス 【アプリ】 ・LINE ・Slack(Discord、 Teams) 【アプリ】 ・OBS
Slide 22
Slide 22 text
デバイスで動作させたプログラム① ブロックベースのビジュアルプログラミング(UIFlow)で作成 BLE経由で温湿度の データを送信
Slide 23
Slide 23 text
デバイスで動作させたプログラム② MQTT経由で 人感センサーで 取得した値を送信
Slide 24
Slide 24 text
終わり!