Setup a Server Proxy in React for a Pre-dev MERN project

If you just started developing a tiny MVP using the MERN project, you should have setup a React app running on the port 3000, and Express server on the port 80.

The shortest way to set up http-proxy-middleware in your React application for a local development project:

yarn add http-proxy-middleware

Create a file called setupProxy.js inside the src folder of your React application and add the following code:

const { createProxyMiddleware } = require('http-proxy-middleware');
module.exports = function(app) {
  app.use(createProxyMiddleware('/api', { target: 'http://localhost:80/' }));
};

Don’t miss these tips!

We don’t spam! Read our privacy policy for more info.

Open chat
Powered by