Tweet
Tweet

Slide 1

Slide 1 text

2023年7月5日 (水) Node-RED Park Vol.12 @オンライン 豊田陽介（ ） @youtoy APIレスポンスの情報を取り出して整形するために templateノードを使った話

Slide 2

Slide 2 text

自己紹介 豊田陽介（ ） @youtoy ・IT系イベント主催、登壇や運営なども ・子ども向けの活動いろいろ ・ Microsoft MVP（2021/10 から） プライベートでの活動 ・ガジェット大好き ・ビジュアルプログラミング／JavaScript 　とガジェットの組み合わせをよくやって 　いたりするかも 好きなこと、他

Slide 3

Slide 3 text

今日のテーマ templateノード

Slide 4

Slide 4 text

どんな時に使った？

Slide 5

Slide 5 text

情報を取り出して 特定のフォーマットにする

Slide 6

Slide 6 text

利用事例：全体フローとtemplateノード ココ

Slide 7

Slide 7 text

全体の処理とtemplateノードの使いどころ ■ フローの処理内容 1）国と都市を指定して API経由で 天気情報を取得 2）API のレスポンスの一部を抜粋 して特定のフォーマットに整形 3）整形後のデータを表で出力 templateノードの設定

Slide 8

Slide 8 text

templateノードの入出力

Slide 9

Slide 9 text

templateノードでの入出力の内容 元のオブジェクトの 特定の部分を取り 出しつつ Key は変更 （天気情報の取得は「node-red-node-openweathermap」を利用）

Slide 10

Slide 10 text

ダッシュボード上での表示 Key の変更後の内容が 表のヘッダに使われる ・テーブルの表示は「node-red-node-ui-table」にて ・templateノードの出力 3つは joinノードでまとめた

Slide 11

Slide 11 text

分かりやすい処理で サクッとデータ整形

Slide 12

Slide 12 text

今回出てきたフローの詳細 こちらの Qiita の記事をご参照ください

Slide 13

Slide 13 text

templateノードで 自分が活用できてないところ

Slide 14

Slide 14 text

構文の「mustache」以外の選択肢 たくさんあるけど活用できてない...

Slide 15

Slide 15 text

templateノード以外 の話ですが

Slide 16

Slide 16 text

enebularでNode-RED 3.0の 新機能が使える！

Slide 17

Slide 17 text

先ほどのフローが見やすくできる！ 線の分岐の適用前 線の分岐を適用

Slide 18

Slide 18 text

これらの流れの後の 思いつきでやったこと

Slide 19

Slide 19 text

LINEアプリへのSticker送信で templateノード ＋ Node-RED 3.0 の新機能 を使ってみる

Slide 20

Slide 20 text

以前行った内容 changeノードを使った LINE Notify での Sticker送信

Slide 21

Slide 21 text

templateノードを使ったところ templateノードの テンプレートで設定 changeノードで設定

Slide 22

Slide 22 text

Node-RED 3.0 の新機能を使ったところ http requestノード内 でヘッダの設定 changeノードで設定

Slide 23

Slide 23 text

もう少し複雑な処理であれば templateノードが活きるかも？

Slide 24

Slide 24 text

追加で試した内容について 詳細は Qiita の記事をご参照ください

Slide 25

Slide 25 text

終わり！