Single executable with Python and React.js

Question

I have two applications

• react.js + node.js app.

• stand alone python app

  I need to merge these two apps and distribute this single app in single executable/binary. I understand i need to get rid of node.js and use python as my backend and change calls going from react-node to react-python. And for the latter i need to bring may be Flask.

  For packaging i can use PyInstaller or cx_freeze.

  Any pointers what is the best way to make this merge and create single executable/binary so that final workflow should be like below :

  1) User gets the single executable/binary

  2) Runs/Executes the executable/binary

  3) This fires up the application which can be accessed on browser

  4) User will be able to send request from UI (React) to Backend (Python)

  So basically the single executable/binary has python env, python backend and react(UI) code.

Answer 1

You can use this design structure to solve this problem, it's like all langs, you need to package the front end inside the public folder of your back-end project:

.
└── project_template/
    ├── server/
    └── static/
        ├── css/
        ├── images/
        └── js/

This project template can be an npm repository that you can customize the script to launch your project.

Example with react and node(you can see the peoject on GitHub):

{
  "name": "poker-hand-analyzer",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "install-frontend-dependencies": "cd ./frontend && yarn install",
    "install-backend-dependencies": "cd ./backend && yarn install",
    "install-dependencies": "yarn install-frontend-dependencies && yarn install-backend-dependencies && yarn install",
    "frontend": "cd ./frontend && yarn start",
    "backend": "cd ./backend && yarn start",
    "start": "concurrently \"yarn frontend\" \"yarn backend\""
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/brunoxd13/poker-hand-analyzer.git"
  },
  "author": "Bruno Russi Lautenschlager",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/brunoxd13/poker-hand-analyzer/issues"
  },
  "homepage": "https://github.com/brunoxd13/poker-hand-analyzer#readme",
  "dependencies": {
    "concurrently": "^4.1.0"
  }
}