Noodl ×Node-REDのよもやま話

E6c980b93d086e757643971b318a40a9?s=47 maepu
September 27, 2019

Noodl ×Node-REDのよもやま話

Node-RED UG勉強会 Vol.9の登壇資料です。
NoodlとNode-REDの連携や比較について、簡単に解説しています。

E6c980b93d086e757643971b318a40a9?s=128

maepu

September 27, 2019
Tweet

Transcript

  1. × の よもやま話 Node-RED UG勉強会 Vol.9 2019/9/27

  2. 流れ 自己紹介 Noodlとは? Node-REDとNoodlを連携 ライブビジュアルコーディング Node-REDとNoodlの比較 まとめ

  3. 自己紹介  まえぷー  組込みソフトエンジニア  業務はマイコンファームウェア開発  趣味でIoT電子工作 

    Node-REDスキル  Functionノードでカスタマイズノード作成  MQTT in/outをよく使います @kmaepu @kmaepu 技術書典7で頒布しました!
  4. Noodl知名度調査! Noodl知ってる、使ったことある方!

  5. Noodlとは? Noodl JPより引用 https://tensorx.co.jp/noodl-jp/

  6. Noodlとは? 【機能】 1.UI/UXのビジュアルデザイン 2.コーディング不要ノードベースで要素を繋ぐだけで構築 (Javascriptでも可) 3.API、リアルデータ、機械学習連携可能 4.IoT(マイコン接続)も可能 5.ウェブアプリケーションまたはハイブリッドアプリとしてデプロイ可能 Noodl のconnpassページから引用

    https://noodl-tokyo.connpass.com/event/145424/
  7. NoodlとNode-REDの連携  MQTT、REST(http request)が連携しやすい  MQTT  TCP/IPネットワークで利用できる軽量な通信プロトコル。  多数の機器間を頻繁にデータのやり取りすることに向いている。

    → IoT向け!  REST  パラメータを指定して特定のURLにHTTPでアクセス。  REST APIが用意されているサービスが沢山ある。 → IoT向け!
  8. NoodlとNode-REDの連携  MQTTで連携する場合  MQTTブローカが必要となる (1) Node-REDのMQTTブローカノード「mosca」を利用する (2) 外部MQTTブローカ(shiftrなど)を利用する enebularとNoodlを

    shiftr.io MQTTブローカー経由で連携しよう https://blog.enebular.com/enebular/enebular-meets-noodl/ enebular blog
  9. NoodlとNode-REDの連携  REST(http request)で連携する場合  NodeREDのhttpノードを利用する  NoodlのRESTノードを利用する  Noodlがhttp

    requestを発行する https://qiita.com/kisaichi07/items/527ba7b3d4ed1dacce07 enebularで作ったREST APIを Noodlから叩いてみた Qiita@kisaichi07
  10. ライブビジュアルコーディング  Noodl×Node-RED×obniz MQTT サーボモータ Webhook ボタン On / Off

    位置 0°/ 90°
  11. NoodlとNode-REDの比較 【Node-RED】  ダッシュボードノードでUIを作成できる。  用意されたUIパーツ(ノード)を並べる。 → お手軽にデータの可視化  作成したUIを共有しづらい。

    (Node-REDの実行環境が必要) 【Noodl】  UIパーツを自由に作りこめる。 → UI作成の自由度が高い  htmlとjsファイルを出力できる。 → Noodl以外の環境で閲覧できる ブラウザがあれば共有できる(チーム開発、顧客との確認)  Androidアプリにすることも可能。
  12. まとめ  現状の使い方  Noodl → フロントエンド、UI特化  Node-RED →

    バッグエンド、サービス連携  今までのIoT電子工作は、UIまで作る例が少なかった Noodlでお手軽にオシャレで独自のUIが作れるようになった!  さらなる連携や利用方法を開拓していきましょう!
  13. まとめ 披露したNoodl × Node-RED × obniz連携方法を 後ほどQiitaにアップする予定です!! @kmaepu @kmaepu

  14. 告知!!  10月のNoodl関連イベントは3本予定されています! Noodlもくもく会# 0 (非公式) 10月5日(土)9:00~12:00 Noodl2.5Hハンズオン(公式) 10月24日(木)19:00~21:30

  15. 告知!! ノンコーディングIoTパーティ (株式会社ウフル様) 10月29日(火)19:00~22:00