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
Node-REDフローの静的解析ツール「Flow Linter」
Search
Kazuhito Yokoi
September 01, 2023
Technology
0
280
Node-REDフローの静的解析ツール「Flow Linter」
「Node-RED 影の薄い機能特集!」のイベントの登壇スライドです。
https://node-red.connpass.com/event/293534/
Kazuhito Yokoi
September 01, 2023
Tweet
Share
More Decks by Kazuhito Yokoi
See All by Kazuhito Yokoi
Practical Low-Code Programming with Node-RED
kazuhitoyokoi
0
17
ローカルLLMを活用したコード生成と、ローコード開発ツールへの応用
kazuhitoyokoi
0
710
ストリートビューで思い出振り返りダッシュボードを作成
kazuhitoyokoi
0
130
Node-RED in Industrial IoT
kazuhitoyokoi
0
1k
Node-REDのフローファイルをGitLabで共有してみる
kazuhitoyokoi
2
670
Other Decks in Technology
See All in Technology
このままAIが発展するだけでAGI達成可能な理由
frievea
0
110
難しいセキュリティ用語をわかりやすくしてみた
yuta3110
0
120
「れきちず」のこれまでとこれから - 誰にでもわかりやすい歴史地図を目指して / FOSS4G 2025 Japan
hjmkth
1
310
AWS Control Tower に学ぶ! IAM Identity Center 権限設計の第一歩 / IAM Identity Center with Control Tower
y___u
0
170
AWS Top Engineer、浮いてませんか? / As an AWS Top Engineer, Are You Out of Place?
yuj1osm
2
210
Data Hubグループ 紹介資料
sansan33
PRO
0
2.2k
フレームワークを意識させないワークショップづくり
keigosuda
0
190
[Keynote] What do you need to know about DevEx in 2025
salaboy
0
170
そのWAFのブロック、どう活かす? サービスを守るための実践的多層防御と思考法 / WAF blocks defense decision
kaminashi
0
200
ガバメントクラウドの概要と自治体事例(名古屋市)
techniczna
3
240
エンタメとAIのための3Dパラレルワールド構築(GPU UNITE 2025 特別講演)
pfn
PRO
0
330
防災デジタル分野での官民共創の取り組み (2)DIT/CCとD-CERTについて
ditccsugii
0
300
Featured
See All Featured
Into the Great Unknown - MozCon
thekraken
40
2.1k
For a Future-Friendly Web
brad_frost
180
10k
Faster Mobile Websites
deanohume
310
31k
Context Engineering - Making Every Token Count
addyosmani
6
260
The Straight Up "How To Draw Better" Workshop
denniskardys
238
140k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
Build The Right Thing And Hit Your Dates
maggiecrowley
37
2.9k
Docker and Python
trallard
46
3.6k
How STYLIGHT went responsive
nonsquared
100
5.8k
Agile that works and the tools we love
rasmusluckow
331
21k
Exploring the Power of Turbo Streams & Action Cable | RailsConf2023
kevinliebholz
35
6.1k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
16
1.7k
Transcript
フローの静的解析ツール「Flow Linter」 2023年8月31日 横井一仁 https://kazuhitoyokoi.github.io/flow-linter/ 1
自己紹介 横井 一仁 (よこい かずひと) Node-RED開発メンバ Node-RED User Group運営 日立製作所
ソリューションアーキテクト DX、Industry 4.0研修講師 2
最近のNode-RED関連の ニュース (1/2) GAIA-X 製造業サプライチェーンをつ なぐGAIA-XがNode-RED採用 Eclipse Foundationの管理下 でOSS開発を推進 NECさん
会社ブログでNode-RED v3.1への 貢献、イベント登壇について紹介 https://jpn.nec.com/oss/communit y/blog/node-red_v3.1.html 3
最近のNode-RED関連の ニュース (2/2) Node-RED Con 2023 11月にNTTコミュニーケーション ズでカンファレンスを開催 OpenJS World
China 2023 9月に上海でOpenJS Foundationのイベントを開催 Node-REDもセッション有 4
Flow Linterの紹介 5
フロー開発で生じる問題 個人開発での から、 大規模開発での まで色々 http-in、responseがペアでない フローにループが存在 ノード名にローカル言語を使用 functionノードの JavaScriptコードの記述が自由
-> これらの問題を避けて、 フローをサクサク開発したい 6
Flow Linterとは バグを生じる可能性があるフローの作成方法に対して警告を表示するツール フローエディタ上でリアルタイムに解析し、警告を表示 functionノードのJavaScriptコードの解析にはESLintを採用 InfoQのニュースでの紹介 7
インストール方法 $ cd ~/.node-red $ npm install nrlint フローエディタを開くと、右側に リントタブが追加される
フローの静的解析も有効となり、 警告時はノードの右上に「!」マ ークが表示される 8
標準で用意されているルール # ルール 説明 1 align-to-grid ノードの配置をワークスペースの格子に合わせる 2 max-flow-size フロー内のノードの上限数(デフォルト:
100個) 3 no-duplicate-http-in-urls http-inに設定したURLの重複を警告 4 no-loops フローのループを検出 5 no-overlapping-nodes ノードが重なりを検出 6 no-unconnected-http-nodes http-in、http responseがペアになっているか 7 no-unnamed-functions functionノードに名前が付けられているか 8 no-unnamed-links linkノードに名前が付けられているか 9
ユーザ設定の画面 ルールの無効/有効は、ユーザ設定 から設定可能 各ルールの詳細設定も可能 カスタムルールの場合、ユーザ設 定UIに独自UIを表示可 10
本格的な使い方 11
functionノード向けルール ESLintのルールを利用できる https://eslint.org/docs/latest/rules/ 12
カスタムルールを作成 標準ルール以外を用いたい場合は、 カスタムルールも作成可能 プラグイン化してnpmに公開する ことも可能 CLI版Flow Linterでも利用可能 https://github.com/kazuhitoyokoi/nrlint -plugin-rules-english-node-name.git 13
カスタムルールのコード 判定条件とメッセージを記載するだけでカスタムルールを実装できる module.exports = { "english-node-name": { meta: { type:
"suggestion", severity: "warn", docs: { description: " 全てのノードの名前を英語のみにする" // ユーザ設定に表示するメッセージ } }, create: function (context, ruleConfig) { return { "node": function (node) { if (!node.config.name.match(/^[ -~]*$/)) { // 判定条件 context.report({ location: [node.id], message: " ノード名は英数字、または記号である必要があります" // 警告メッセージ }) } } } } } }; 14
コマンドライン版Flow Linter フローの静的解析をコマンドラインで行う インストールと実行 $ npm install -g nrlint $
nrlint --init > .nrlintrc.js $ nrlint ~/.node-red/flows.json 15
設定ファイル「.nrlintrc.js」の内容 ルールを有効にしたい際は「true」、無効にしたい際は「"off"」を指定 module.exports = { "rules": { "align-to-grid": true, "max-flow-size":
true, "no-duplicate-http-in-urls": true, "no-loops": "off", // 無効 "no-overlapping-nodes": true, "no-unconnected-http-nodes": true, "no-unnamed-functions": true, "no-unnamed-links": true, } } 16
カスタムルールも動作 module.exports = { "plugins": [ "nrlint-plugin-rules-english-node-name" // 追加 ],
"rules": { "align-to-grid": true, "max-flow-size": true, "no-duplicate-http-in-urls": true, "no-loops": "off", "no-overlapping-nodes": true, "no-unconnected-http-nodes": true, "no-unnamed-functions": true, "no-unnamed-links": true, "english-node-name": true // 追加 } } 17
GitHub Actionsで 自動テスト GitHubにフローを置くタイミング で、自動的にFlow Linterを実行 開発プロジェクトにて、フローの 開発方法を事前定義 18
最後に 19
日本語化のPull Requestを出してみました https://github.com/node-red/nrlint/pull/40 20
書籍紹介 秋に発売予定の書籍で、 GitLab CIでの活用例を紹介予定 21