What's the best way to structure a MERN stack project?

Backend
1

Hey everyone,

I’m working on a MERN stack project and I’m not sure how to set up my folders. Right now, I’ve got my Express and Mongoose backend in one folder, and my React frontend (made with create-react-app) in another.

I’m thinking of organizing it like this:

/project
  /client
    /src
    package.json
  /server
    /models
    server.js
    package.json

But I’m not sure if this is the right way to do it. Here are my main questions:

  1. How do I make the app run when the client and server folders are next to each other?
  2. Should I have separate package.json files for the client and server? What about node_modules?

I want to make sure I’m following best practices. Any advice would be really helpful! Thanks in advance.

2

That structure looks solid! For running both, use a tool like concurrently in ur root package.json. Something like:

“scripts”: {
“start”: “concurrently "npm run client" "npm run server"”,
“client”: “cd client && npm start”,
“server”: “cd server && node server.js”
}

Separate package.jsons r good. keeps dependencies cleaner. good luck with ur project!

3

hmm, interesting setup! have u considered using Docker? it can make running ur MERN stack super smooth. Plus, it’d solve ur package.json dilemma. Whats ur thoughts on containerization? ever tried it before? Could be a fun experiment for ur project! how complex is ur app gonna be?

4

Your project structure is on the right track. I’ve used a similar setup in my MERN projects with great success. For running both client and server, I recommend using ‘npm-run-all’ in your root package.json. It’s lightweight and flexible. Here’s how I set it up:

“scripts”: {
“start”: “run-p start:*”,
“start:client”: “cd client && npm start”,
“start:server”: “cd server && node server.js”
}

This approach allows for easy scaling if you add more services later. Regarding package.json files, I prefer separate ones for client and server. It keeps dependencies isolated and makes deployment smoother, especially if you’re using different hosting solutions for frontend and backend. Just ensure your .gitignore handles multiple node_modules correctly.