How to include and launch node-red from javascript framework like Vue.js etc?

how to include and luanch the node-red from javascript framework like vue

Hi and welcome to the forum.

Perhaps you could explain more about what you are wanting to achieve?

Node-RED flows run on the back-end (server) whereas the Editor and things like the Dashboard and uibuilder work in the front-end (browser).

It is perfectly possible to build a service that lets you start back-end services from a web page but to do so, you need a communications channel and that needs a service on the server. So you see that you end up in a circular argument. You can also use Node-RED to provide the comms channel but it needs to be running to do so - you can stop/start other services, and even node-red itself (I have a flow that kills node-red, the systemd OS service will restart it).


Atually, I created a vue app and in that app I was installed node-red with npm.
I need to get the node-red editor in my vue component. But I dont know how to integrate and lauch the node-red. Could you please help me on this.

in node-red doc, I am seeing one thing like " Embedding node-red into existing app " But i didn't get any thing from that

Thing is that Node-RED is primarily a server whereas VueJS is client-side.

The embedding documentation shows you how to embed Node-RED into an existing Node.js application. That is possible since Node.js is the service that runs Node-RED anyway if you run it directly,

So I'm not sure what you've done so far since I don't know of any way to run npm from VueJS. npm is also server side not client.

Okay.. Is that possible to integrate and launch Node-red on Vue app or not ? If yes, let me know the process please

I don't think we understand exactly what you want to do. Please explain in more detail what you mean. What s/w is running on what machines? What do you want the user to see?

I can't think that it would be possible since you would have to replicate much of node.js's capability in the browser. Might be possible but I've no idea how.

Perhaps what @DevanandBaipotu is actually trying to do is show the node-red editor and/or dashboard in the browser inside a Vue app.

yes Colin, I need to show the node-red editor in the browser inside a vue app.
Is that possible with/without using node.js ?

You are not giving much to go on.

You can use an iframe to displaythe node-red editor in your app, however this assumes that you have node-red running as a server somewhere else.

Where are you serving the vue app from?

I want to run node-red in node.js and want to display the node-red editor in Vue app

As @bakman2 said, you can easily run the node-red editor in an iframe in the Vue app. Just set the url for the iframe to be that for the node red server.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.