React With Express

Project structure

root
  - client (create-react-app) running on port 3000
  - server (express app)  running on port 8080

In Development

Add proxy to package.json, so that requests not handled by client will be redirected to server.

"proxy": "http://localhost:8080/"

Note that this only affects development, NOT the production in any way.

Then you can use fetch in client to talk to server:

fetch("/api/foo")
      .then((response) => response.json())
      .then((result) => { ... })

In Production

Add this to Express app:

if (process.env.NODE_ENV === 'production') {
  app.use(express.static(__dirname + '/../client/build'));
}

create-react-app will build the static app into client/build folder. This tells the server to serve the client app as static resources.