Navigate back to the homepage

How to create multiple nodes in the node-red single module?

Infinitbility
Node-red
June 3rd, 2022 · 1 min read

Hi Friends 👋,

Welcome To Infinitbility! ❤️

To create multiple nodes in a single module or package, just put one more key and values in your package.json file where node-red/nodes is mentioned. like the below example.

1"node-red" : {
2 "nodes": {
3 "lower-case": "lower-case/lower-case.js",
4 "upper-case": "upper-case/upper-case.js"
5 }
6},

Note: We can make n number of custom nodes in a single module but every node should have different js and html.

Today, I’m going to show How do I create multiple nodes in the node-red single module, here I will create a custom node of lower-case and upper-case in a single package.

Let’s start the today’s tutorial How do you create multiple nodes in the node-red single module?

Table of contents

  1. Multi node setup and configuration
  2. Write node-red code
  3. Node installation in node-red
  4. Use nodes in node-red

Multi node setup and configuration

  1. Create your project directory and move our cmd in the created directory.

    1mkdir multi-node-example && cd multi-node-example
  2. Initialize npm to set up node project, it will make package.json file in our directory.

    1npm init
    Node-red, Creation of node
    Node-red, Creation of node example
  3. Put node-red configuration in the package.json file.

    1"node-red" : {
    2 "nodes": {
    3 "lower-case": "lower-case/lower-case.js",
    4 "upper-case": "upper-case/upper-case.js"
    5 }
    6},
    • Implementation of node-red configuration in package.json file example
    1{
    2 "name": "multi-node-example",
    3 "version": "1.0.0",
    4 "description": "Example of multi node setup",
    5 "main": "index.js",
    6 "scripts": {
    7 "test": "echo \"Error: no test specified\" && exit 1"
    8 },
    9 "node-red" : {
    10 "nodes": {
    11 "lower-case": "lower-case/lower-case.js",
    12 "upper-case": "upper-case/upper-case.js"
    13 }
    14 },
    15 "keywords": [
    16 "Node-red",
    17 "Multi-node"
    18 ],
    19 "author": "Infinitbility",
    20 "license": "MIT"
    21}

Write node-red code

Now, we know, we are going to create two nodes and they both have their own js and HTML files, so let’s create them.

lower-case node

create a new folder lower-case in your project and put below mentioned filed and their code.

lower-case/lower-case.js

1module.exports = function(RED) {
2 function LowerCaseNode(config) {
3 RED.nodes.createNode(this,config);
4 var node = this;
5 node.on('input', function(msg) {
6 msg.payload = msg.payload.toLowerCase();
7 node.send(msg);
8 });
9 }
10 RED.nodes.registerType("lower-case",LowerCaseNode);
11}

lower-case/lower-case.html

1<script type="text/javascript">
2 RED.nodes.registerType('lower-case',{
3 category: 'fontcase',
4 color: '#a6bbcf',
5 defaults: {
6 name: {value:""}
7 },
8 inputs:1,
9 outputs:1,
10 icon: "file.png",
11 label: function() {
12 return this.name||"lower-case";
13 }
14 });
15</script>
16
17<script type="text/html" data-template-name="lower-case">
18 <div class="form-row">
19 <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
20 <input type="text" id="node-input-name" placeholder="Name">
21 </div>
22</script>
23
24<script type="text/html" data-help-name="lower-case">
25 <p>A simple node that converts the message payloads into all lower-case characters</p>
26</script>

upper-case node

Create a new folder upper-case in your project and put the below-mentioned files and their code.

upper-case/upper-case.js

1module.exports = function(RED) {
2 function UpperCaseNode(config) {
3 RED.nodes.createNode(this,config);
4 var node = this;
5 node.on('input', function(msg) {
6 msg.payload = msg.payload.toUpperCase();
7 node.send(msg);
8 });
9 }
10 RED.nodes.registerType("upper-case",UpperCaseNode);
11}

upper-case/upper-case.html

1<script type="text/javascript">
2 RED.nodes.registerType('upper-case',{
3 category: 'fontcase',
4 color: '#a6bbcf',
5 defaults: {
6 name: {value:""}
7 },
8 inputs:1,
9 outputs:1,
10 icon: "file.png",
11 label: function() {
12 return this.name||"upper-case";
13 }
14 });
15</script>
16
17<script type="text/html" data-template-name="upper-case">
18 <div class="form-row">
19 <label for="node-input-name"><i class="fa fa-tag"></i> Name</label>
20 <input type="text" id="node-input-name" placeholder="Name">
21 </div>
22</script>
23
24<script type="text/html" data-help-name="upper-case">
25 <p>A simple node that converts the message payloads into all upper-case characters</p>
26</script>

Yes, now our node coding part is done, let’s install node dependency if there.

Currently, we haven’t any dependency if you have don’t forget to run the below npm installation command in your project directory.

1npm install

Node installation in node-red

Now, our node creation part is done show let’s install it in our node-red.

To test a node module locally the npm install <folder> command can be used. This allows you to develop the node in a local directory and have it linked into a local node-red install during development.

Go to your .node-red which is located in username dir.

1npm install D:\multi-node-example
Node-red, installation of node
Node-red, installation of node example

That’s it, let’s restart your node-red using the below command in your .node-red folder.

1node-red

let’s check it our node in browser.

Node-red, output of node
Node-red, Output of node example

I hope it’s help you, All the best 👍.

  • multi-node-example node-red Github Repo
  • Create custom node in node-red

Follow me on Twitter

Join our email list and get notified about new content

No worries, I respect your privacy and I will never abuse your email.

Every week, on Tuesday, you will receive a list of free tutorials I made during the week (I write one every day) and news on other training products I create.

Looking For React Native Tutorial?

we are trying to create the best Tutorial for react native developers.

When you want a daily updates about React Native Tutorial or infinitbility update subscribe to our newsletter.

Read React Native Tutorial

Request New Tutorial or Article on mail [email protected]

Guide book

Guidebook: The Javascript Monorepo Photoshop Guide

Tutorials

Categories

More articles from Infinitbility

How to check if number is prime in javascript?

Example of check if number is prime or not in javascript with step by step guide.

June 2nd, 2022 · 1 min read

How to check if a character is a letter or number in JavaScript?

Example of check if a character is a letter or number in javascript with step by step guide.

June 1st, 2022 · 1 min read
© 2020–2022 Infinitbility
About
Link to $https://medium.com/infinitbilityLink to $https://www.facebook.com/InfinitbilityLink to $https://github.com/infinitbilityLink to $https://twitter.com/infinitbilityLink to $https://www.buymeacoffee.com/infinitbilityLink to $mailto:[email protected]