how do you start an express server with react on heroku?

Question

I have managed to get my app working on heroku and I can hit the url and it loads successfully.

the problem is this is just the React frontend (locally I fire up on port 3000). I then also use an express node server as my backend for my api end points and then firebase as my data. when running locally I have been firing it up on 3007. however, I've just deployed and it's running the frontend but none of the API calls are being made (I presume it has not started the server)

how can I link the 2 up or tell heroku to run the other server command as well?

Piekarski D · Accepted Answer · 2019-02-12 21:16:38Z

1

Imagine you have folder structured

-main folder
--client folder
--server stuff

try writing in server's package.json

  "scripts": {
    "heroku-postbuild": "NPM_CONFIG_PRODUCTION=false npm install --prefix client && npm run build --prefix client"
  }

then deploy project to heroku from server folder's level

this will build your client during the time you're deploying your whole project

@edit

also add


if (process.env.NODE_ENV === "production") {
  app.use(express.static("client/build"));
  const path = require("path");
  app.get("*", (req, res) => {
    res.sendFile(path.resolve(__dirname, "client", "build", "index.html"));
  });
}

to server's index.js file

edited Feb 12, 2019 at 21:16

answered Feb 12, 2019 at 19:27

Piekarski D

3771 gold badge4 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Red Baron Over a year ago

ok so where should my src/ folder live? I tried putting that all inside the client folder and it broke

Red Baron Over a year ago

ok I have it serving up my routes now on heroku but it wont load the frontend??

Collectives™ on Stack Overflow

how do you start an express server with react on heroku?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related