Lock in $30 Savings on PRO—Offer Ends Soon! ⏳
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Node-RED でデバイス・アプリ連携(ローカル通信もネット経由も) / TECH Stre...
Search
you(@youtoy)
PRO
May 27, 2021
Technology
0
4.6k
Node-RED でデバイス・アプリ連携(ローカル通信もネット経由も) / TECH Street _ Node-RED
you(@youtoy)
PRO
May 27, 2021
Tweet
Share
More Decks by you(@youtoy)
See All by you(@youtoy)
ローカルLLMをJavaScriptで(少しAIエージェントSDKなどの話も) / 冬のJavaScript祭り @Pleasanter Lounge
you
PRO
0
880
Webの技術で「特殊なゲーム用コントローラーや他デバイスなど」とブラウザを連携させる / HTML5 11th Anniversary
you
PRO
0
65
ブラウザのAPIで Nintendo Switch用の特殊なゲーム用コントローラーを体験型コンテンツに / IoTLT @ストラタシス・ジャパン
you
PRO
0
180
ローカルLLMとLINE Botの組み合わせ その2(EVO-X2でgpt-oss-120bを利用) / LINE DC Generative AI Meetup #7
you
PRO
1
190
生成AIとM5Stack / M5 Japan Tour 2025 Autumn 東京
you
PRO
0
380
子ども向けの活動や自身のモノづくり活動などでやったこと / micro:bit ファンの集い
you
PRO
0
20
ブラウザのAPIで色々なデバイスをあれこれ扱ってみた話(主にWeb HID API) / IoTLT @JLCPCB オープンハードカンファレンス
you
PRO
0
150
ヒーローズ・リーグの応募作品で使ったデバイス・アイテム・ライブラリなど / #ヒーローズリーグ 2025 開発素材LT
you
PRO
0
54
最近発売された端末+UIFlow 2.0の組み合わせ(+1.0の話)をUSB接続で / ビジュアルプログラミングIoTLT vol.21
you
PRO
0
120
Other Decks in Technology
See All in Technology
Microsoft Agent 365 についてゆっくりじっくり理解する!
skmkzyk
0
380
多様なデジタルアイデンティティを攻撃からどうやって守るのか / 20251212
ayokura
0
490
JEDAI認定プログラム JEDAI Order 2026 エントリーのご案内 / JEDAI Order 2026 Entry
databricksjapan
0
140
Lambdaの常識はどう変わる?!re:Invent 2025 before after
iwatatomoya
1
630
Databricks向けJupyter Kernelでデータサイエンティストの開発環境をAI-Readyにする / Data+AI World Tour Tokyo After Party
genda
1
550
re:Invent2025 3つの Frontier Agents を紹介 / introducing-3-frontier-agents
tomoki10
0
240
打 造 A I 驅 動 的 G i t H u b ⾃ 動 化 ⼯ 作 流 程
appleboy
0
360
会社紹介資料 / Sansan Company Profile
sansan33
PRO
11
390k
AWS re:Invent 2025で見たGrafana最新機能の紹介
hamadakoji
0
420
S3を正しく理解するための内部構造の読解
nrinetcom
PRO
2
150
Amazon Quick Suite で始める手軽な AI エージェント
shimy
0
180
ディメンショナルモデリングを支えるData Vaultについて
10xinc
1
110
Featured
See All Featured
Rebuilding a faster, lazier Slack
samanthasiow
85
9.3k
Building Flexible Design Systems
yeseniaperezcruz
330
39k
Principles of Awesome APIs and How to Build Them.
keavy
127
17k
Automating Front-end Workflow
addyosmani
1371
200k
StorybookのUI Testing Handbookを読んだ
zakiyama
31
6.5k
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
47
7.9k
Balancing Empowerment & Direction
lara
5
800
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.8k
For a Future-Friendly Web
brad_frost
180
10k
Art, The Web, and Tiny UX
lynnandtonic
304
21k
The MySQL Ecosystem @ GitHub 2015
samlambert
251
13k
Transcript
Node-RED でデバイス・アプリ連携 (ローカル通信もネット経由も) 2021年5月27日 (木) TECH Street @オンライン 豊田 陽介
( @youtoy )
豊田陽介(@youtoy) 自己紹介 普段は、某通信会社の研究所勤務 自宅に各種デバイス等 がたくさん ビジュアルプログラミング・ IoTなどのテーマ関連 ガジェット好き その他 IT系イベント主催・運営、登壇なども、
子ども向けの活動いろいろ(IT系以外も) プライベートでの活動
今日の話はNode-REDで デバイス連携
デバイス間をつなぐ仕組み・できること ・HTTPリクエスト ・Websocket ・MQTT デバイス間で直接 ネット経由 ・シリアル通信 ・BLE ・MIDI つなぐ
仕組み できる こと ・既製品のデータ取得 (温湿度計など) ・電子工作デバイスで のプロトタイピング ・◦◦を検知したらLINE ・Slack等に通知 ・スマートホームの 仕組みを自前で作る Node-RED で利用可能なものの例(いろいろある中の一部)
PCを使い、まずは多機能な デバイスと組み合わせて プロトタイピングしてみる
例えばBluetooth搭載デバイスとの間で 温度 25.1℃ 湿度 56% M5Stack+センサー PC 部屋の環境モニタ センシング 可視化
具体的なフロー(プログラムの部分)
具体的なフロー(プログラムの部分) 値の取り出し、 グラフ化 BLE接続、データ取得など データ変換
デモ動画(温湿度のグラフ化)
テキストプログラミング でもできますが
Node-REDで手軽に実現 JavaScript の例 Node-REDの例 GUI上でボタン 操作・文字入力 で進める BLE の処理の流れ を把握しつつ
プログラミング
さらに仕組みを追加するのも手軽に 温度 25.1℃ 湿度 56% M5Stack+センサー PC 部屋の環境モニタ センシング 可視化
スマホアプリ通知 スマホ インターネット 経由
やりとりの仕組みを 別のものにしてみる
インターネットを経由させるように変更 デバイス +センサー PC 無線(BLE) デバイス +センサー (多地点) PC インターネット経由
MQTT ブローカー リアルタイム 通信(MQTT) 近距離無線 遠隔地間での通信
接続方法を変えるのも手軽に デバイス +センサー PC 無線 (BLE) デバイス +センサー PC 有線
(シリアル通信) BLE非対応 デバイス BLE対応 デバイス
実際に作ってみると(人感センサー利用) デバイス +センサー (多地点) PC インターネット経由 MQTT ブローカー リアルタイム 通信(MQTT)
画面表示 フロー
具体的なフロー(プログラムの部分) MQTTブローカーとの 接続、データ処理など 場所 A 場所 B 可視化
別アプリの制御にも
デモ動画(OBSのアプリ外からの制御)
デバイス関連の補足
【デバイス】 ・M5Stack関連 ・obniz 連携できるデバイス・アプリの例 たくさんの種類がある中で利用したことがあるものの一部 デバイス内/ローカル インターネット経由 【デバイス】 ・micro:bit ・toio
・M5Stack関連 ・MIDI対応デバイス 【アプリ】 ・LINE ・Slack(Discord、 Teams) 【アプリ】 ・OBS
デバイスで動作させたプログラム① ブロックベースのビジュアルプログラミング(UIFlow)で作成 BLE経由で温湿度の データを送信
デバイスで動作させたプログラム② MQTT経由で 人感センサーで 取得した値を送信
終わり!