[Solved]-how to build a standalone desktop app built with react, using a node backend, and wrap both frontend and backend in electron as a desktop app?-Reactjs

Wow. That certainly seems interesting.

You can build the react app and then wrap Electron around it instead of running a react server. yarn build should do the trick if you are using create-react-app boilerplate.

You need to make sure the build path is correct. This is the reason why your built react app is empty in the Electron.

So, that all the variables are correctly being called from index.html. You can achieve this functionality by specifying "homepage":"./" in package.json. You will have to find out what path Electron for absolute reference. Or perhaps you can open a static endpoint for all files in build directory. You will have to figure that out. I have never worked with Electron. Check this. Here it says "homepage":"./" should work. https://medium.com/@brockhoff/using-electron-with-react-the-basics-e93f9761f86f

As for node server I am sure you must be making calls to the API endpoints you have written. If not you can do so using native Javascript. I personally prefer using axios.

import axios from 'axios';

async componentWillMount(){
    const result = await axios.get(localhost:8080/get)
    console.log(result)
    // You can now directly display result on the react app or save it save. 
    this.setState({result:result})
}

Axios Package: https://www.npmjs.com/package/axios

I figured out the solution. When wrapping electron using react, the react app has to use a hashRouter instead of browserRouter. For details checkout my other question: How to use React HashRouter for route query parameters?

Then to wrap the node server, put the node server folder as a dependency in React app folder's package.json. then run npm install to install it as an dependency. Then require the main starting file for node server in electron's starting file this starts the server.