Deploying node app to heroku with client and server in two separate folders

As far as I know nowadays making two deploys is the most used solution for big projects evolving many devs, in one part your frontend with vue.js that will fetch the data from a remote api which is your backend and second deploy. Exactly, you will have to change your baseURL to app_name.herokuapp.com Also you will probably will have to enable CORS.

Also if you want to try new things I recommend you try surge for your front deployment ;) so easy and so fast!

Maybe you already know it but, Heroku sets it's own ports so you will need to create a .env file and assign it via ssh or manually in the Heroku dashboard.

This repo shows the setup of Node.js serving up a React frontend running on a single Heroku dyno: https://github.com/mars/heroku-cra-node

I was able to get one up and running using this as a guide. For cleanliness i modified my folder structure to be very similar to op's: client/server/package.json.gitignore.env(etc)

I think Mark Brought up a good repo, but I wanted to emphasize how Heroku works. As Heroku documentation said "Heroku Node.js support will only be applied when the application has a package.json file in the root directory."

What should I do then?

When deploying both a client and server code together, you would want to put the server's code at the root of the folder and continue to keep the client's code in a separate folder.

Example of a React and Express Application folder structure:

App|+-- client               (folder)  (root)|   ||   +--node_modules      (folder)|   +--src               (folder)|   +--public            (folder)|   +--package.json      (file)|   +--package-lock.json (file)|         +-- node_modules         (folder)  (root)       +-- index.js             (file)    (root)+-- package.json         (file)    (root)+-- package-lock.json    (file)    (root)

As you can see, the server code is all in the root folder while the react application is kept in the client folder. From here, you need to make sure that you set up the correct script for your server package.json.

Remember that the server's package.json is instruction for Heroku on how to start your application.

This is what a proper script would look like in the root server's package.json

"scripts": {    "start": "node index.js",    "heroku-postbuild": "cd client && npm install && npm run build"  }