Recent Enhancements of Node-RED for Rapid Development of Large Scale and Robust IoT Applications

. .

.2.2 0.,21010 Agenda

1. Introduction to Node-RED 2. Flow-based Programming in Node-RED 3. Recent Features of Node-RED

© Hitachi, Ltd. 2019. All rights reserved. 2 Agenda

1. Introduction to Node-RED 2. Flow-based Programming in Node-RED 3. Recent Features of Node-RED

© Hitachi, Ltd. 2019. All rights reserved. 3 What is Node-RED?

OSS Visual Programing Tool for IoT Applications Development p Originally developed by IBM. Currently project under OpenJS Foundation p Works on broad range of computers: Small IoT devices to Cloud Env. p Rapid development of Applications by connecting set of predefined nodes

d9RLRM)*02UURP[N[NNM 4 Growing Use of Node-RED

Node-RED users are growing continuously since its introduction: p Over 60K downloads/month in 2019 p 1.8M accumulated downloads in 2019

(K downloads) Accumulated(Left) Monthly(Right) (K downloads) 2,000 80 70 1,500 60 50 1,000 40 30 Number of Number Number of Number 500 20 10 Downloads/Month Accumulated Downloads Downloads Accumulated 0 0 Jan '15 Jan '16 Jan '17 Jan '18 Jan '19

NPM download Statistics of Node-RED d9RLRM)*02UURP[N[NNM 5 Production Use of Node-RED

Major IT companies adopting Node-RED for their products/services

For Edge Environment: In HITACHI: p Use Node-RED in "DevOps for IoT" application :WNU BRNVNW[ 8 ":XC8Na ":C)) "NMR development env. of Lumada Solution Hub*

BV[]WP CX[RK 4 "2AC: "B:G "4G:E

Cloud Environment:

:3 2CC 4:B4 ":34UX]M "2CCUX5N[RPWN "NTR

BRNVNW[ ]SR[] 9:C249: "RWMBNN "4:2 "]VM

*: [1((RLRLXV(N(LWN[(VXW()*0(),(*0),*/VU d9RLRM)*02UURP[N[NNM 6 HITACHI's Contribution to Node-RED

p HITACHI started OSS activities on Node-RED in 2017 p Added features to Node-RED and contributed them to community (over 51,000 lines of code)

Lines of codes in Node-RED repository 50,000

40,000 Other

30,000 HITACHI started IBM 20,000 contribution HITACHI

10,000

0 Jan-16 Jan-17 Jan-18 Jan-19 Contributor's Ranking of GitHub: 5 from HITACHI in top 10 Contributions from HITACHI

d9RLRM)*02UURP[N[NNM 7 Agenda

1. Introduction to Node-RED 2. Flow-based Programming in Node-RED 3. Recent Features of Node-RED

© Hitachi, Ltd. 2019. All rights reserved. 8 Programming in Node-RED

Flow-based Visual Programing Tool for IoT Applications Development p Rapid development by simply connecting set of predefined nodes p Over 2,100 nodes available1FNK2:8D:5PV(XLMPNNL

&4.&423 &32

4

211 2

d9RLRM)*02UURP[N[NNM 9 Flow-based Programming

Node-RED uses message based processing model

FLOW Node -- message , (JS object) --, 4XWXUUX N[[PNUX

5 N[[PN Wire ERKUN N[[PN(4XWN SUBFLOW BNVNW XMN

]WLRXW XMN(BD3F

Comparison of Concepts

d9RLRM)*02UURP[N[NNM 10 Available Node-RED Nodes p Over 2,100 nodes available: Web API, GUI, Data Mgmt./Proc., Edge, etc. p Nodes are easily installable from Node-RED Editor

Web API:

GUI:

Data Mgmt./Processing:

Edge Device:

Node-RED Library

d9RLRM)*02UURP[N[NNM 11 Node-RED Execution & Installation

p XMN&A5R[NKURLRXWXTRWPXWKXXOLUX]MWMNMPN[RMN p Easy to Install!

Client on your browser Cloud or edge or local env.

Editor page WEB editor

Runtime Execute Flow data ()

Installation: (Linux/MacOS/Windows) ## sudo npm install –g nodered; nodered –p 1880 ## docker docker run -p 1880:1880 nodered/node-red-docker

d9RLRM)*02UURP[N[NNM 12 DEMO: Weather Map of World Cities

Web API: Weather Data Web Browser

1. Get weather data 2. Handle weather data 3. Plot data on map of cities

Node-RED © Hitachi, Ltd. 2019. All rights reserved. 13 Agenda

1. Introduction to Node-RED 2. Flow-based Programming in Node-RED 3. Recent Features of Node-RED

© Hitachi, Ltd. 2019. All rights reserved. 14 New Features

Productivity Robustness

SUBFLOW Enhancements+ Testing Framework (UI* & Flow†) UI Widgets*+/Layout Tool* Flow Validation (Lint)†

Node Template Generation* Quality Improvements*

Functionality Usability

Message Sequence Nodes+ Improved Node Representation+*

Persistable Context+ Internationalization+

Dashboard Extension API+ Documentation+

*: In current release (~0.20), +: In future release (1.0~), †: In discussion © Hitachi, Ltd. 2019. All rights reserved. 15 New Features

Productivity Robustness

SUBFLOW Enhancements Testing Framework (UI & Flow)

UI Widgets/Layout Tool Flow Validation (Lint)

Node Template Generation Quality Improvements

Functionality Usability

Message Sequence Nodes Improved Node Representation

Persistable Context Internationalization

Dashboard Extension API Documentation

© Hitachi, Ltd. 2019. All rights reserved. 16 New Features

Productivity Robustness

SUBFLOW Enhancements Testing Framework (UI & Flow)

UI Widgets/Layout Tool Flow Validation (Lint)

Node Template Generation Quality Improvements

Functionality Usability

Message Sequence Nodes Improved Node Representation

Persistable Context Internationalization

Dashboard Extension API Documentation

© Hitachi, Ltd. 2019. All rights reserved. 17 Node-RED for Scalable Solutions p Node-RED is a highly effective tool for rapid creation of new solutions. p On the other hand, we want to create basis for sharing common solution patterns useful for creating new custom solutions by novice IT users

Prototype New Problem Solution Problem

Abstraction & Refactoring Customize & Apply Solution Pattern

d9RLRM)*02UURP[N[NNM 18 Creating Custom Solutions p Abstraction with current FLOW, SUBFLOW or Node is not sufficient p Needs a way to ease creation and customization of solutions

Creation Customization FLOW easy (visual editor) difficult (no specific customization point) SUBFLOW easy (visual editor) difficult (no specific customization point) Node difficult (HTML+JS) easy (node settings UI)

Prototype New Problem Solution Problem

Abstraction & Refactoring Customize & Apply Solution Pattern

d9RLRM)*02UURP[N[NNM 19 SUBFLOW Enhancements

By adding customization capability to SUBFLOW, SUBFLOW can define similar functionality to existing nodes using Node-RED editor GUI

Item Node SUBFLOW (ToBe) Logic JavaScript Flow (via GUI) Info Text HTML None → Markdown (via GUI) (document) Icon Any Picture None → Icon Font (via GUI) Category Any Category None → Any Category (via GUI) Settings UI HTML None Color Any Color None

d9RLRM)*02UURP[N[NNM 20 SUBFLOW Enhancements

By adding customization capability to SUBFLOW, SUBFLOW can define similar functionality to existing nodes using Node-RED editor GUI

Item Node SUBFLOW (ToBe) Logic JavaScript Flow (via GUI) Info Text HTML None → Markdown (via GUI) (document) Icon Any Picture None → Icon Font (via GUI) Category Any Category None → Any Category (via GUI) Settings UI HTML None Color Any Color None

*: under development. will be included in 1.0 release~ d9RLRM)*02UURP[N[NNM 21 Settings UI Definition for SUBFLOW

Developing Settings UI definition feature which allows GUI-based definition of SUBFLOW settings UI

Generate

SUBFLOW UI Definition Generated Input UI

d9RLRM)*02UURP[N[NNM 22 Exporting SUBFLOW as Node

Enhanced SUBFLOW feature ease creating & sharing common solution patterns by novice IT users

Current Node Install npm npm Node Development module repository (JS+HTML) Difficult for novice users

Create Create Flow Subflow

share Easy for solutions Node from novice users easily SUBFLOW New Node copy & paste JSON data Development

*: under design discussion d9RLRM)*02UURP[N[NNM 23 New Features

Productivity Robustness

SUBFLOW Enhancements Testing Framework (UI & Flow)

UI Widgets/Layout Tool Flow Validation (Lint)

Node Template Generation Quality Improvements

Functionality Usability

Message Sequence Nodes Improved Node Representation

Persistable Context Internationalization

Dashboard Extension API Documentation

© Hitachi, Ltd. 2019. All rights reserved. 24 Node-RED Dashboard p Node-RED provides capability to create simple GUI p To meet wider range of requirements, we created following features: Plugin API for new UI widget, new UI widgets, and layout editor Plugin API Plugin UI widgets from HITACHI

Dashboard Node-RED Dashboard Layout Editor UI widgets from other OSS contributors

d9RLRM)*02UURP[N[NNM 25 Example UI Widget: Vega Node

n Supports various kinds of data visualization described in JSON n Naturally fits with JSON based message processing of Node-RED

b b [LNV1 RM1-))b [LNV1 NRP1))RM1-)) [LNV1 MMRWP1.NRP1))RM1-)) M1HMMRWP1.NRP1)) M1HMMRWP1. I M1H VT[1HI VT[1HI I VT[1H I c I Plugin API c c Node-RED Dashboard

Vega JSON Data Visualization with Specification Vega Node

$1ENP1[1((NPPR]KRX(NP( d9RLRM)*02UURP[N[NNM 26 Dashboard Layout Tool p Creating complex GUI layout is cumbersome in current Node-RED p Dashboard Layout Tool allow intuitive layout of dashboard GUI

Layout based on order of widgets

apply layout

Order of Widgets (old) Layout Editor (new)

d9RLRM)*02UURP[N[NNM 27 DEMO: SUBFLOW & Dashboard

/ Message from Node-RED Creators

© Hitachi, Ltd. 2019. All rights reserved. 29 Conclusion

Join Node-RED Community!

p Node-RED: https://nodered.org p Slack: https://node-red.slack.com/ p GitHub: https://github.com/node-red

,* 32 Trademarks

‒ IBM, Watson are registered trademarks of Limited. International Business Machines Corporation. ‒ Slack is a registered trademark of Slack ‒ AT&T is a registered trademark of AT&T Inc. Technologies, Inc. ‒ Fujitsu and COLMINA are registered trademarks of ‒ GitHub is a registered trademark of GitHub, Inc. Fujitsu Ltd. ‒ Twitter is a registered trademark of Twitter, Inc. ‒ is a registered trademark of Microsoft ‒ Docker is a registered trademark of Docker, Inc. Corporation. ‒ NEC and CONNEXIVE are registered trademarks of NEC Corporation. ‒ GE and Predix are registered trademarks of General Electric Company. ‒ Intel is a registered trademark of Intel Corporation. ‒ Samsung is a registered trademark of Samsung C&T Corporation. ‒ Samsung Artik is a registered trademark of Samsung Electronics Co. Ltd. ‒ Siemens and SIMATIC are registered trademarks of Siemens Aktiengesellschaft. ‒ Toshiba is a registered trademark of Toshiba Corporation. ‒ SPINEX is a registered trademark of Toshiba Digital Solutions Corporation. ‒ MySQL is a registered trademark of MySQL Aktiebolag. ‒ MongoDB is a registered trademark of MongoDB

© Hitachi, Ltd. 2019. All rights reserved. 33