react proxy setup proxy middleware code example

Example: http proxy middleware

// TIPS AND TRICK CUSTOM PROXY IN WEBPACK DEV SERVER BY restuwahyu13
//NOTE this method like using CRA in React

// manual proxy before
module.exports = {
	devServer: {
		open: true,
		compress: true,
		hot: true,
		inline: true,
		lazy: true,
		contentBase: resolve(process.cwd(), 'build'),
		port: process.env.PORT || 3000,
		proxy: {
          '/api/*', {
          	target: 'http://localhost:3001',
			secure: false,
			changeOrigin: true,
			headers: {
				'Access-Control-Allow-Origin': '*',
				'Access-Control-Allow-Credentials': '*',
				'Access-Control-Allow-Methods': '*'
			}
          }
        }
		liveReload: false
	}
}

// custom proxy after
module.exports = {
	devServer: {
    open: true,
    compress: true,
    hot: true,
    inline: true,
    watchContentBase: true,
    contentBase: resolve(process.cwd(), 'build'),
    historyApiFallback: true,
    before: (app, server, compiler) => {
      const fileExist = existsSync('./src/setupProxy.js')
      if (fileExist) {
        const pathProxy = resolve(process.cwd(), 'src/setupProxy')
        return require(`${pathProxy}`)(app)
      }
    },
    port: process.env.PORT || 3000,
    liveReload: false
  }
}