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
540
Noodl×Node-REDハンズオン
maepu
November 21, 2019
Tweet
Share
More Decks by maepu
See All by maepu
仮想通貨アラート(物理)を作ってみた
maepu
0
470
enebular×Noodlで保活お助けサービス構築に挑戦!
maepu
0
230
ビジュアルプログラミングでハロウィンを楽しもう!
maepu
0
300
LINE LIFFを出窓菜園に取り入れてみた
maepu
0
630
遠隔で嫁に筋トレを応援してもらう
maepu
0
710
ぽーずるん「ぐにゃシャキ」@ProtoOut オンラインハッカソン
maepu
0
81
Noodlで受付嬢を創った
maepu
1
1.8k
Bay WIndow Garden新たなる家庭菜園のカタチ~カメラ編~
maepu
0
400
Noodlに出会ってから作ったものを振り返る
maepu
1
250
Other Decks in How-to & DIY
See All in How-to & DIY
enebularを活用したNode-REDによるIoTシステム開発と運用
taokiuhuru
0
420
IoTカーテンオープナー
keicafeblack
0
280
How to create better speaker proposals
logico_jp
2
330
LTのモチベーション
akrolayer
1
530
【1周年】Blueskyちゃん総集編を通じて青空を遊びつくそう
kawaiirailroads
0
260
[AWS Expert Online for JAWS-UG] Amazon CloudWatch で できる n 個のこと
awsjcpm
0
140
Chaos V-Ray Render Pool Manual [EN]
renderpool
0
360
骨折と入院とIoT #iotlt
n0bisuke2
1
200
スターバックスの黒板アートを生成AIで描かせてみたら...
scbc1167
0
370
苦いビールを避ける冴えたやり方
watany
2
150
#相席食堂 ちょっと待てぃボタンダイジェスト+ソラコムボタン #iotlt
n0bisuke2
0
320
drumstick_jacket.pdf
lyh125
0
500
Featured
See All Featured
How to train your dragon (web standard)
notwaldorf
88
5.7k
A Philosophy of Restraint
colly
203
16k
Optimising Largest Contentful Paint
csswizardry
33
2.9k
Scaling GitHub
holman
458
140k
A Tale of Four Properties
chriscoyier
156
23k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
14
2k
A Modern Web Designer's Workflow
chriscoyier
693
190k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
6.9k
How to Think Like a Performance Engineer
csswizardry
20
1.1k
Done Done
chrislema
181
16k
Why You Should Never Use an ORM
jnunemaker
PRO
53
9k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
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!
本日はご参加ありがとうございました!