Skip to content

README.md

Latest commit

 

History

History
189 lines (131 loc) · 7.38 KB

README.md

File metadata and controls

189 lines (131 loc) · 7.38 KB

MEAN Stack Example: Employee Records App (MongoDB, Express, Angular, Node.js)

A full-stack CRUD application built with MongoDB, Express, Angular, and Node.js (MEAN).

Companion code for the MEAN Stack Tutorial.

CI License: Apache-2.0 GitHub stars

Project Overview

This project demonstrates an employee record tracker:

  • Create records
  • Read records from MongoDB
  • Update records
  • Delete records

The Angular app in client calls an Express API in server, and data is stored in MongoDB.

MEAN Stack Architecture

┌─────────────────────┐       REST (JSON)      ┌──────────────────────────┐
│   Angular (CLI)     │ ─────────────────────► │  Express API             │
│   client            │ ◄───────────────────── │  server                  │
│   :4200             │                        │  :5300                   │
└─────────────────────┘                        └───────────┬──────────────┘
                                                           │ MongoDB Node.js driver
                                                           ▼
                                               ┌──────────────────────────┐
                                               │  MongoDB                 │
                                               │  database: meanStackExample
                                               │  collection: employees   │
                                               └──────────────────────────┘

Stack:

  • Frontend: Angular 21, Angular Material
  • Backend: Node.js, Express 4, TypeScript, MongoDB Node.js Driver 6
  • Database: MongoDB (meanStackExample.employees collection)

Project Structure

client/   # Angular frontend
server/   # Express API + MongoDB integration

Prerequisites

  • Node.js 20+
  • npm 9+
  • A local MongoDB instance or a free MongoDB Atlas cluster

Quick Start and MongoDB Setup

# 1) Clone
git clone https://github.com/mongodb-developer/mean-stack-example.git
cd mean-stack-example

# 2) Create server environment file
cp server/.env.example server/.env

Update server/.env with one of the following DATABASE_URI values:

Local MongoDB:

DATABASE_URI=mongodb://localhost:27017/
PORT=5300

Atlas cluster:

DATABASE_URI=mongodb+srv://<username>:<password>@<cluster>.mongodb.net/
PORT=5300

If you are new to Atlas, use the Atlas quick start guide and then paste your connection string into DATABASE_URI.

Optional: seed sample data:

(cd server && npm install && npm run seed)

Start the backend API:

cd server
npm start

Start the frontend in a second terminal:

cd client
npm install
npm start

Open http://localhost:4200.

GitHub Codespaces and Dev Containers

GitHub Codespaces is an easy and fast way to get this project running without installing anything locally. It uses a dev container, which is a Docker environment configured for development.

Open in GitHub Codespaces

REST API Endpoints

Base URL: http://localhost:5300

Method Endpoint Description
GET /healthcheck Check API readiness
GET /employees Retrieve all employees
GET /employees/:id Retrieve one employee by ID
POST /employees Create an employee
PUT /employees/:id Update an employee
DELETE /employees/:id Delete an employee

Example request body for create or update:

{
    "name": "Jane Smith",
    "position": "Developer",
    "level": "senior"
}

MongoDB Features Demonstrated

Feature Where
MongoDB Node.js Driver server/src/database.ts
CRUD operations server/src/employee.routes.ts
MongoDB schema validation startup validation in server/src/database.ts
Environment-based connection setup DATABASE_URI in server/.env

Troubleshooting

Cannot connect to MongoDB Atlas

  • Verify DATABASE_URI in server/.env
  • Confirm your database user credentials are correct (Atlas)
  • Confirm your IP is in Atlas Network Access

Backend fails to start

  • Check Node version: node --version
  • Confirm server/.env exists
  • Reinstall dependencies in server: npm install

Frontend shows empty data

  • Confirm backend is running on :5300
  • Open browser dev tools and check network requests
  • Confirm records exist in MongoDB (or run cd server && npm run seed)

Port already in use

  • Change PORT in server/.env, or stop the process using :5300

Community and Support

Additional Resources

License

Apache 2.0

Disclaimer

This repository is for educational use and is not a supported MongoDB product.