Chapter 12: Technology Stacks — LAMP, LEMP, MEAN, MERN
12.4 MEAN and MERN architecture
Think of a MERN app like a restaurant: the menu card in your hand is the React frontend (runs in the browser), the waiter is Nginx, the kitchen is the Express API, and the store room is MongoDB. Technically, the browser downloads static JS files, then makes HTTP calls to /api/..., which Nginx proxies to Node.js, which queries MongoDB.
Both stacks use JavaScript everywhere: the frontend (Angular or React) runs in the browser, the backend API (Express on Node.js) runs on the server, and data is stored as JSON-like documents in MongoDB.
+------------------------- EC2 -----------------------------+
| |
Browser ──:80──► | Nginx |
(runs the SPA) | ├── / → static build of React/Angular |
| │ (/var/www/mern or /var/www/mean) |
| │ try_files $uri /index.html |
| └── /api/* → proxy_pass http://127.0.0.1:5000 |
| Node.js + Express API (pm2) |
| │ Mongoose |
| ▼ |
| MongoDB 127.0.0.1:27017 (mongod) |
+-----------------------------------------------------------+
Why build the frontend? React/Angular dev servers (npm start, ng serve on ports 3000/4200) are only for development. For production we run npm run build / ng build, which produces plain HTML/CSS/JS files that Nginx serves very efficiently as a static site.