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
270
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
ローカルLLMを活用したコード生成と、ローコード開発ツールへの応用
kazuhitoyokoi
0
550
ストリートビューで思い出振り返りダッシュボードを作成
kazuhitoyokoi
0
130
Node-RED in Industrial IoT
kazuhitoyokoi
0
1k
Node-REDのフローファイルをGitLabで共有してみる
kazuhitoyokoi
2
630
Other Decks in Technology
See All in Technology
AWS認定を取る中で感じたこと
siromi
1
190
MUITにおける開発プロセスモダナイズの取り組みと開発生産性可視化の取り組みについて / Modernize the Development Process and Visualize Development Productivity at MUIT
muit
1
16k
Core Audio tapを使ったリアルタイム音声処理のお話
yuta0306
0
190
SEQUENCE object comparison - db tech showcase 2025 LT2
nori_shinoda
0
140
PO初心者が考えた ”POらしさ”
nb_rady
0
210
fukabori.fm 出張版: 売上高617億円と高稼働率を陰で支えた社内ツール開発のあれこれ話 / 20250704 Yoshimasa Iwase & Tomoo Morikawa
shift_evolve
PRO
2
7.8k
20250707-AI活用の個人差を埋めるチームづくり
shnjtk
4
3.9k
OPENLOGI Company Profile for engineer
hr01
1
34k
「クラウドコスト絶対削減」を支える技術—FinOpsを超えた徹底的なクラウドコスト削減の実践論
delta_tech
4
170
怖くない!はじめてのClaude Code
shinya337
0
400
オーティファイ会社紹介資料 / Autify Company Deck
autifyhq
10
130k
ビズリーチにおけるリアーキテクティング実践事例 / JJUG CCC 2025 Spring
visional_engineering_and_design
1
120
Featured
See All Featured
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
740
Understanding Cognitive Biases in Performance Measurement
bluesmoon
29
1.8k
KATA
mclloyd
30
14k
Statistics for Hackers
jakevdp
799
220k
Making the Leap to Tech Lead
cromwellryan
134
9.4k
Product Roadmaps are Hard
iamctodd
PRO
54
11k
The Cult of Friendly URLs
andyhume
79
6.5k
Raft: Consensus for Rubyists
vanstee
140
7k
Adopting Sorbet at Scale
ufuk
77
9.5k
StorybookのUI Testing Handbookを読んだ
zakiyama
30
5.9k
Git: the NoSQL Database
bkeepers
PRO
430
65k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
130
19k
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