🧱 Full-Stack Boilerplate Setup (Express + MongoDB) — Beginner Friendly Guide

This guide walks you through setting up a full-stack boilerplate using Node.js, Express, and MongoDB with modern project structure, so you can focus on building features — not struggling with setup.

---

🛠️ 1. Project Initialization

Step 1: Create a new folder and initialize the project

mkdir my-fullstack-app
cd my-fullstack-app
npm init

• Press Enter to go through the prompts OR manually add your name, version, etc.

• This creates a package.json file where all your dependencies and scripts are listed.

Step 2: Create the main entry file

touch index.js

This is where your backend server starts running.

---

🗂️ 2. Enable import Syntax (ES Module)

By default, Node.js uses require() (CommonJS), but modern apps often prefer import.

To use import, update your package.json:

{
  "type": "module"
}

---

🔐 3. Set Up Environment Variables

Step 3: Install dotenv to manage environment variables

npm install dotenv

Step 4: Create a .env file

touch .env

Add your variables:

PORT=3000
MONGO_URL=your_mongo_connection_string
BASE_URL=http://localhost:3000

Then load them in your code:

import dotenv from "dotenv";
dotenv.config();

---

🚀 4. Set Up Express

Step 5: Install Express

npm install express

Step 6: Basic Express server setup

// index.js
import express from "express";
import dotenv from "dotenv";
dotenv.config();

const app = express();
const port = process.env.PORT || 3000;

app.get("/", (req, res) => {
  res.send("Hello World!");
});

app.listen(port, () => {
  console.log(`Server running on port ${port}`);
});

---

🔁 5. Enable Auto Reload with Nodemon

Nodemon restarts the server when files change.

npm install -D nodemon

Update your package.json scripts:

"scripts": {
  "start": "nodemon index.js"
}

Now start your server:

npm run start

---

🧰 6. Use CORS and JSON Middleware

Step 7: Install and configure CORS

npm install cors

Then use it in index.js:

import cors from "cors";

app.use(cors({
  origin: process.env.BASE_URL,
  credentials: true,
  methods: ["GET", "POST", "DELETE", "OPTIONS"],
  allowedHeaders: ["Content-Type", "Authorization"]
}));

Step 8: Parse JSON and Form Data

app.use(express.json());
app.use(express.urlencoded({ extended: true }));

This makes sure your backend can read incoming data properly.

---

🛢️ 7. Connect to MongoDB with Mongoose

Step 9: Install Mongoose

npm install mongoose

Step 10: Setup Database Connection

Create a folder called utils and inside it a file db.js:

mkdir utils
touch utils/db.js

Inside utils/db.js:

import mongoose from "mongoose";

const db = () => {
  mongoose.connect(process.env.MONGO_URL, {
    useNewUrlParser: true,
    useUnifiedTopology: true,
  })
  .then(() => console.log("✅ Connected to MongoDB"))
  .catch((err) => console.error("❌ DB Connection Error", err));
};

export default db;

Step 11: Import and call db function in index.js:

import db from "./utils/db.js";
db();

---

🧠 8. Create a Model (User Example)

Step 12: Create a model folder and a User schema

mkdir model
touch model/User.model.js

Inside User.model.js:

import mongoose from "mongoose";

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

const User = mongoose.model("User", userSchema);
export default User;

---

📦 9. Controller + Routes Folder Structure

Use MVC-style separation: Models, Controllers, Routes.

---

Step 13: Create a controller

mkdir controller
touch controller/user.controller.js

Inside user.controller.js:

const registerUser = async (req, res) => {
  res.send("User registered!");
};

export { registerUser };

---

Step 14: Create routes

mkdir routes
touch routes/user.routes.js

Inside user.routes.js:

import express from "express";
import { registerUser } from "../controller/user.controller.js";

const router = express.Router();

router.get("/register", registerUser);

export default router;

---

Step 15: Use your routes in index.js

import userRoutes from "./routes/user.routes.js";

app.use("/api/v1/users", userRoutes);

Visit this URL in browser or Postman:

http://localhost:3000/api/v1/users/register

You’ll see: "User registered!"

---

🧾 Final Project Structure (Suggestion)

my-fullstack-app/
├── controller/
│   └── user.controller.js
├── model/
│   └── User.model.js
├── routes/
│   └── user.routes.js
├── utils/
│   └── db.js
├── .env
├── index.js
├── package.json

---

✅ What You’ve Built

You now have:

• 🔹 Express backend with modular structure

• 🔹 MongoDB connected using Mongoose

• 🔹 Routes and Controllers separated

• 🔹 .env config for secrets

• 🔹 Nodemon + ESModules support

• 🔹 JSON & CORS handling

You're now ready to build out your backend features, connect it to a frontend, or deploy to the cloud.