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
Noodl×Node-REDハンズオン
Search
maepu
November 21, 2019
How-to & DIY
1
450
Noodl×Node-REDハンズオン
maepu
November 21, 2019
Tweet
Share
More Decks by maepu
See All by maepu
仮想通貨アラート(物理)を作ってみた
maepu
0
440
enebular×Noodlで保活お助けサービス構築に挑戦!
maepu
0
220
ビジュアルプログラミングでハロウィンを楽しもう!
maepu
0
290
LINE LIFFを出窓菜園に取り入れてみた
maepu
0
610
遠隔で嫁に筋トレを応援してもらう
maepu
0
630
ぽーずるん「ぐにゃシャキ」@ProtoOut オンラインハッカソン
maepu
0
54
Noodlで受付嬢を創った
maepu
1
1.6k
Bay WIndow Garden新たなる家庭菜園のカタチ~カメラ編~
maepu
0
360
Noodlに出会ってから作ったものを振り返る
maepu
1
220
Other Decks in How-to & DIY
See All in How-to & DIY
Open Source Sonne tanken | Wallboxen mit evcc smarter machen
naltatis
1
2k
もくもく会? / mokumokukai?
tbshiki
0
280
The story of repairing my junk keyboard with The kinT keyboard controller
kurotaky
0
1.2k
Wear OSでwatch face作成~令和になってもCanvas芸?~
cibmc
1
620
Dirbtinis intelektas dizainerio gyvenime
lekevicius
0
150
How to Build Confidence and Achieve Challenges
satoshoco
1
540
AWS User Community JAWS-UGとAWSグローバルコミュニティプログラム
awsjcpm
1
1k
オフライン勉強会ぼっち対策
akatsuki174
1
470
IoTカーテンオープナー
keicafeblack
0
150
データエンジニアのためのテクニカルサポートとLLM
yutomatsunoo
0
600
LTのモチベーション
akrolayer
1
320
衛星通信を使ってLチカしてみた #starlink #iotlt
n0bisuke2
0
360
Featured
See All Featured
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
125
32k
The Mythical Team-Month
searls
216
42k
Faster Mobile Websites
deanohume
299
30k
Bash Introduction
62gerente
604
210k
GitHub's CSS Performance
jonrohan
1025
450k
Keith and Marios Guide to Fast Websites
keithpitt
408
22k
Why You Should Never Use an ORM
jnunemaker
PRO
51
8.6k
5 minutes of I Can Smell Your CMS
philhawksworth
199
19k
Sharpening the Axe: The Primacy of Toolmaking
bcantrill
17
1.4k
GraphQLとの向き合い方2022年版
quramy
32
12k
The Language of Interfaces
destraynor
151
23k
Learning to Love Humans: Emotional Interface Design
aarron
267
39k
Transcript
Noodl×Node-RED ハンズオン 2019/11/21 Noodlもくもく会 #2 メンター:まえぷー × ※NoodlロゴはNoodl Labより引用
お願い 本日の様子をTwitteで呟いていただくと嬉しいです! 写真撮影OKです!!! ツイートする際は次のハッシュタグでお願いします。 #Noodl #Noodlもくもく会 #eLV勉強会 #noderedjp
認識調査! •Noodlを使ったことある方! •Node-REDを使ったことある方!
準備の確認 •Noodl ver1.3.1 •Node-RED (enebularまたはローカル) •OpenweatherMAPの登録
本日の流れ 1. Noodlもくもく会とは 2. メンター紹介 3. NoodlとNode-REDの概要説明 4. 本日作るもの説明 5.
NoodlでUI(画面)作成 ~休憩~ 6. Node-REDで天気情報取得 7. NoodlとNode-RED連携 8. まとめ
1.Noodlもくもく会とは
2.メンター紹介 • まえぷー • 職:組込みソフトエンジニア • 業務内容: • 組込み機器のファームウェア開発 •
最近の活動: • IoT電子工作 • 技術書同人誌の頒布 • 出窓菜園 @kmaepu @kmaepu
3.Noodlとは? • UI/UXのビジュアルプロトタイピングツール • フローベースの開発環境 • ノンコーディングでUIを作成できる • 外部連携も可能(MQTT、REST) •
無償で利用できる https://tensorx.co.jp/noodl-jp/ 公式サイトはこちら
3.Node-REDとは? • IoT連携ツール • ハードウェア、API、データベース等の連携が容易 • フローベースの開発環境 • ラズパイやクラウド、様々な実行環境がある •
無償で利用できる https://tensorx.co.jp/noodl-jp/ 公式サイトはこちら
4.本日作るもの お天気情報アプリ
5.Noodlで画面作成 ~ハンズオン~
6.Node-REDで天気情報取得 ~ハンズオン~
7.NoodlとNode-RED連携 ・連携方法は2種類 ① MQTT通信 ② REST (HTTP request) RESTによる連携は右の記事が 参考になります!
今回はこちらを使用します https://qiita.com/kisaichi07/items/527ba7b3d4ed1dacce07
7.NoodlとNode-RED連携 ・MQTT通信とは - Message Queueing Telemetry Transport の略 - TCP/IPネットワークを利用した通信プロトコルの1つ
- HTTP通信よりヘッダが少ないので軽量 - 非同期のパブリッシュ(送信)/サブスクライブ(受信)型
7.NoodlとNode-RED連携 https://qiita.com/kmaepu/items/644b0bf2c3f438e71aa6 今回使用するMQTTブローカはshiftr.ioです。 送信者 受信者 MQTTブローカ パブリッシュ サブスクライブ Shiftr.ioへのリンク
7.NoodlとNode-RED連携 ~ハンズオン~ ×
8.まとめ ・NoodlとNode-REDを利用すると、プログラムを書くことなく 開発できます。 ・NoodlはUI作成が得意、Node-REDはサービス連携が得意。 ・こんなことに利用できそう - 自作ラジコンのコントローラー - スマートリモコン
イベント情報 https://node-red.connpass.com/event/153172/
イベント情報 https://elv.connpass.com/event/154629/
イベント情報 Qiitaのアドベントカンレンダー参加者募集中!! https://qiita.com/advent-calendar/2019/noodl
おまけ ・NoodlとNode-REDの入門本販売中! ・基本操作~連携について説明しています。 ・受付に見本があります。 ・イベント限定で定価¥1,000 → ¥800 ・アドベントカレンダー参加確約で → ¥500
20% OFF! 50% OFF!
本日はご参加ありがとうございました!