How to run both the back-end and front-end in MERN stack

I am building a simple MERN stack app, I am using axios for my http requests to the back-end so i am using 2 terminals in vscode for running both express and react, I’d like to know what’s the best way to run them both? should i use a proxy url in package.json?

Classic MERN app would indeed consist of 2 apps, client (Express - React) and API (Express - Mongo). You can run both on different ports (you would need at least 3 ports, one for Mongo, one for client and one for API)

1 Like

I had an issue like that. I solved it with concurrently. Put both the server and client in the same subfolder, initialise that with a new config.json and then add concurrently as per the documentation. It executes directly from the config, so not much to configure and both are up and running from one console.

1 Like

Cool, thanks for the tip!

I think it is useful for you becused I used it in proper way together like:

  • /client
    – /src

    – index.js
    – registerServiceWorker.js

  • .gitignore

  • package-lock.json

  • package.json

  • /server

  • /models
    – item.js

  • /node.modules
    – …

  • server.js

  • package-lock.json

  • package.json
    I also stuck here, during working on client folder inside server folder or if server folder inside client. 1. But how to make it run when two folders are siblings? 2. What should be package.json and where node.modules should be (whether both server and client should have it’s own package.json and modules?)

Hi @ananyagupta!

This topic has not been active for over a year.

Please try to participate in newer topics.