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
Node-RED でデバイス・アプリ連携(ローカル通信もネット経由も) / TECH Stre...
Search
you(@youtoy)
PRO
May 27, 2021
Technology
0
4.7k
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
910
Webの技術で「特殊なゲーム用コントローラーや他デバイスなど」とブラウザを連携させる / HTML5 11th Anniversary
you
PRO
0
72
ブラウザのAPIで Nintendo Switch用の特殊なゲーム用コントローラーを体験型コンテンツに / IoTLT @ストラタシス・ジャパン
you
PRO
0
190
ローカルLLMとLINE Botの組み合わせ その2(EVO-X2でgpt-oss-120bを利用) / LINE DC Generative AI Meetup #7
you
PRO
1
840
生成AIとM5Stack / M5 Japan Tour 2025 Autumn 東京
you
PRO
0
400
子ども向けの活動や自身のモノづくり活動などでやったこと / micro:bit ファンの集い
you
PRO
0
25
ブラウザのAPIで色々なデバイスをあれこれ扱ってみた話(主にWeb HID API) / IoTLT @JLCPCB オープンハードカンファレンス
you
PRO
0
160
ヒーローズ・リーグの応募作品で使ったデバイス・アイテム・ライブラリなど / #ヒーローズリーグ 2025 開発素材LT
you
PRO
0
58
最近発売された端末+UIFlow 2.0の組み合わせ(+1.0の話)をUSB接続で / ビジュアルプログラミングIoTLT vol.21
you
PRO
0
130
Other Decks in Technology
See All in Technology
RALGO AIを組織に組み込む方法 -アルゴリズム中心組織設計- #RSGT2026 / RALGO: How to Integrate AI into an Organization – Algorithm-Centric Organizational Design
kyonmm
PRO
2
230
Autonomous Database - Dedicated 技術詳細 / adb-d_technical_detail_jp
oracle4engineer
PRO
5
12k
「エッジ×分散生成AI」の技術と変わる産業、そしてITの未来
piacerex
0
100
「アウトプット脳からユーザー価値脳へ」がそんなに簡単にできたら苦労しない #RSGT2026
aki_iinuma
6
2k
Bedrock AgentCore Evaluationsで学ぶLLM as a judge入門
shichijoyuhi
2
310
Keynoteから見るAWSの頭の中
nrinetcom
PRO
1
160
I tried making a solo advent calendar!
zzzzico
0
120
AIと融ける人間の冒険
pujisi
0
110
Cloud WAN MCP Serverから考える新しいネットワーク運用 / 20251228 Masaki Okuda
shift_evolve
PRO
0
130
_第4回__AIxIoTビジネス共創ラボ紹介資料_20251203.pdf
iotcomjpadmin
0
170
複雑さを受け入れるか、拒むか? - 事業成長とともに育ったモノリスを前に私が考えたこと #RSGT2026
murabayashi
0
800
Scrum Guide Expansion Pack が示す現代プロダクト開発への補完的視点
sonjin
0
210
Featured
See All Featured
Bootstrapping a Software Product
garrettdimon
PRO
307
120k
The Pragmatic Product Professional
lauravandoore
37
7.1k
WENDY [Excerpt]
tessaabrams
9
35k
Darren the Foodie - Storyboard
khoart
PRO
0
2k
Leading Effective Engineering Teams in the AI Era
addyosmani
9
1.4k
Un-Boring Meetings
codingconduct
0
170
SEO in 2025: How to Prepare for the Future of Search
ipullrank
3
3.3k
Automating Front-end Workflow
addyosmani
1371
200k
Art, The Web, and Tiny UX
lynnandtonic
304
21k
jQuery: Nuts, Bolts and Bling
dougneiner
65
8.3k
A Modern Web Designer's Workflow
chriscoyier
698
190k
The B2B funnel & how to create a winning content strategy
katarinadahlin
PRO
0
220
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経由で 人感センサーで 取得した値を送信
終わり!