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.