202410_HackRockFes2024 Node-RED 紹介

202410_HackRockFes2024「Node-RED 紹介」の登壇資料です。

◆スライド内の素材は以下を使用させていただいております。ありがとうございます！

・シルエットデザイン http://kage-design.com/
・human pictogram 2.0 http://pictogram2.com
・ICOOON MONO http://icooon-mono.com/
・Adobe Stock https://stock.adobe.com/jp

Transcript

1. 202410_HackRockFes2024 Node-RED 紹介 ワンフットシーバス 田中正吾
2. Node-RED https://nodered.jp/
3. IoTなど様々なAPI/Data連携をGUIで 直感的に構築できるオープンソースソフトウェア
4. Node.js で出来ていて npm でインストールして使えます sudo npm install -g --unsafe-perm node-red
5. 手元のPCでもクラウドでも Raspberry Piのようなデバイスでも使えます このあたりは Node.js / npm による導入のしやすさがプラスには働いています 手元のPC IBM Cloud・Azure・ さくらインターネットなど
6. 日本語ドキュメントも翻訳されたものが たくさんにあって調べやすい Qiita やブログなどにもいろいろと文献あり https://nodered.jp/docs/ sudo npm install -g --unsafe-perm node-red
7. GUI の話 GUI(Graphic User Interface) IoTなど様々なAPI/Data連携をGUIで 直感的に構築できるオープンソースソフトウェア
8. Node-RED の画面 手元のPCの場合 node-red コマンドで起動すると http://localhost:1880/ でブラウザで表示
9. 大きく分けて3つのエリアがあります パレット・ワークスペース・サイドバー パレット ワークスペース サイドバー
10. パレット 絵の具のようにノードという機能のかたまりが置かれています。 パレットはインストール済みで利用可能なすべてのノードが含まれます。 パレット
11. パレット 標準でもこのような機能が揃っています。
12. このノードは様々な機能のノードがあり flows という形で検索できインストールできます フロー検索 : https://flows.nodered.org/
13. Slack で検索した例 いろいろなノードを世界中の開発者がつくっている！実際の公開先は npm。
14. ワークスペース ワークスペースはパレットからノードを配置してフロー（データの流れ）を作るエリア ワークスペース
15. サイドバー サイドバーは、エディタ内に多くの便利なツールを提供するエリアです。 サイドバー
16. ノードはNode-REDの基本的な構成要素です。 処理をする機能のかたまりです。 ノード
17. ノードをつないでフローという データの流れを作ります ノード ノード ノード
18. 前のノードからメッセージを受け取るか、 外部イベントを受け取ることで動きます ノードはメッセージまたはイベントを処理し次のノードにメッセージを送り、右から左に処理されます。 ノード ノード ノード メッセージ (JSONデータ) メッセージ (JSONデータ) 処理 0_0 処理 外部イベントなど データのきっかけ 起きた！
19. メッセージはJSONデータで構成されます。 各ノードで処理された内容がバケツリレーのようにやり取りされていきます。 ノード ノード メッセージ (JSONデータ) 処理 処理
20. メッセージの中身 msg という一番上のオブジェクトがあり、 配下の payload というオブジェクトが連絡に良く使われます。 ノード ノード メッセージ (JSONデータ) 処理 処理 msg payload 様々なデータ 様々なデータ
21. こんな感じのバケツリレー ノード ノード 処理
22. デモしてみます！
23. inject ノードと debug ノードをつなぐデモ
24. このような仕組み タイムスタンプ メッセージ (JSONデータ) デバッグデータを 表示する処理 ボタンクリックを きっかけにメッセージを送る
25. デバッグタブに文字が出るデモしてみます！
26. API連携の話 API(Application Programming Interface) IoTなど様々なAPI/Data連携をGUIで 直感的に構築できるオープンソースソフトウェア
27. パレットにはじめから多彩な接続ノードがあります IoTで良く使われる MQTT や WEB まわりで使われる HTTP / WebSocket など揃えています
28. API は HTTP でつなぐことが多いですが Node-RED にも HTTP 関連ノードあります API サーバー Node-RED
29. HTTP の関連ノード
30. ことはじめ、お伝えしました
31. IoTなど様々なAPI/Data連携をGUIで 直感的に構築できるオープンソースソフトウェア
32. Node-RED は色々なものをつなぐツール
33. ➔ obniz 連携 ➔ Unity 連携 ➔ Vonage 連携 エクストラ 時間があれば調べてみる