How MERN Stack Development Differs from Regular Programming

mern-app/
├── client/          # React frontend
│   ├── src/
│   └── package.json
├── server/          # Express + Node backend
│   ├── models/      # MongoDB models
│   ├── routes/      # API routes
│   └── index.js
└── README.md

Why MERN uses one language:
- JavaScript on both client and server
- Shared validation logic possible
- Easier for beginners to learn one language deeply
- Large ecosystem (npm)

// Regular programming: solve one problem
function sum(a, b) {
  return a + b;
}
console.log(sum(2, 3));

// MERN app: connect layers
// server/routes/users.js
router.get('/users', async (req, res) => {
  const users = await User.find();
  res.json(users);
});

// client/src/App.jsx
useEffect(() => {
  fetch('/api/users')
    .then(r => r.json())
    .then(setUsers);
}, []);

// server/models/User.js
const mongoose = require('mongoose');

const userSchema = new mongoose.Schema({
  name: { type: String, required: true },
  email: { type: String, required: true, unique: true },
}, { timestamps: true });

module.exports = mongoose.model('User', userSchema);

// server/routes/users.js
const express = require('express');
const User = require('../models/User');
const router = express.Router();

router.get('/', async (req, res) => {
  const users = await User.find();
  res.json(users);
});

router.post('/', async (req, res) => {
  const user = await User.create(req.body);
  res.status(201).json(user);
});

module.exports = router;

MERN project workflow:
1. Create MongoDB schema + model
2. Build Express routes and controllers
3. Test endpoints with Postman
4. Build React components
5. Fetch data from React
6. Add auth / error handling
7. Deploy backend + frontend
8. Set up environment variables

Beginner checklist:
□ Can I write a Mongoose model?
□ Can I build a GET and POST route?
□ Can I fetch data in React?
□ Can I render a list from an API?
□ Can I handle errors gracefully?
□ Can I deploy the app?