Ilja Ilja - 14 days ago 8
React JSX Question

Set up proxy server for create react app

I have started a react application using create-react-app and ran the

npm run eject
script to gain access to all files. I afterwards installed express and created
server.js
file that sits on same level as
package.json
file

these are
server.js
file contents:

const express = require('express');
const app = express;

app.set('port', 3031);

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

app.listen(app.get('port'), () => {
console.log(`Server started at: http://localhost:${app.get('port')}/`);
})


Nothing crazy here, just setting up for future api proxies where I need to use secrets and as I don't want to expose my api.

after this I added a
"proxy": "http://localhost:3001/"
to my
package.json
file. I am now stuck as I need to figure out how to start my server correctly and use this
server.js
file in development mode and afterwards in production.

Ideally It would also be good if we could use more that one proxy i.e.
/api
and
/api2

Answer

You didn't have to eject to run your server.js. You can just run it with node server.js together with create-react-app.

You can still do npm start even after ejecting to start your dev server.

To run /api1 and /api2, you just have to handle it in your server.js file and it should work just fine. You need to match the port in your server.js and the one in proxy settings inside package.json - in this case, it should be "proxy": "http://localhost:3031"