Learning Management System

A comprehensive full-stack e-learning platform built with the MAD Stack (MongoDB, Angular, Django) featuring modern DevOps practices, cloud-native architecture, and enterprise-grade security.

Angular 18 Django 4.2 MongoDB 5.0 Redis 6 Docker Kubernetes AWS
Live Demo View on GitHub Quick Start

Project at a Glance

Enterprise-grade learning management solution with comprehensive features

10
Core Features
25+
API Endpoints
3
Database Systems
100%
Containerized

Core Features

Everything you need for a modern learning management system

👥

User Management

Complete user authentication and authorization with JWT tokens, role-based access control (RBAC), and support for students, instructors, and administrators.

📚

Course Management

Create, update, delete, and organize courses with categories, lessons, multimedia content, and rich text descriptions. Full CRUD operations available.

📝

Quiz System

Interactive quizzes with multiple-choice questions, automatic grading, progress tracking, and detailed analytics for instructors.

📊

Progress Tracking

Real-time progress monitoring for students, lesson completion tracking, achievement milestones, and comprehensive reporting dashboards.

⚡

Redis Caching

High-performance server-side caching with Redis for improved response times, reduced database load, and enhanced scalability.

🔒

Security

Enterprise-grade security with encrypted passwords, secure token management, CORS protection, and comprehensive API authentication.

📱

Responsive Design

Fully responsive interface built with Bootstrap 5, optimized for desktop, tablet, and mobile devices with PWA capabilities.

📡

RESTful API

Comprehensive REST API with Swagger/OpenAPI documentation, versioning support, and extensive endpoint coverage for all features.

🔔

Notifications

Real-time notification system for course updates, enrollment confirmations, progress achievements, and important announcements.

🚀

CI/CD Pipeline

Automated deployment with GitHub Actions and Jenkins, Docker containerization, and Kubernetes orchestration for seamless updates.

System Architecture

Modern, scalable, and cloud-native architecture design

High-Level Architecture

graph TB subgraph "Client Layer" A[Web Browser] B[Mobile Browser] end subgraph "Frontend - Angular SPA" C[Angular Components] D[Angular Services] E[HTTP Interceptors] F[State Management] end subgraph "API Gateway" G[NGINX Reverse Proxy] end subgraph "Backend - Django REST API" H[Django REST Framework] I[Authentication Layer] J[Business Logic] K[Serializers & ViewSets] end subgraph "Caching Layer" L[Redis Cache] end subgraph "Data Persistence" M[(MongoDB - Course Data)] N[(SQLite - Auth Data)] end A --> C B --> C C --> D D --> E E --> G G --> H H --> I I --> J J --> K K --> L K --> M I --> N style C fill:#dd0031 style H fill:#092e20 style M fill:#47a248 style L fill:#dc382d

Authentication Flow

sequenceDiagram participant User participant Angular participant Django participant SQLite participant Redis User->>Angular: Enter Credentials Angular->>Django: POST /api/auth/login/ Django->>SQLite: Verify Credentials alt Valid Credentials SQLite-->>Django: User Valid Django->>Django: Generate JWT Token Django->>Redis: Cache Token Django-->>Angular: {token, user} Angular->>Angular: Store in localStorage Angular-->>User: Redirect to Dashboard else Invalid Credentials SQLite-->>Django: Invalid Django-->>Angular: 401 Unauthorized Angular-->>User: Show Error end

Database Schema

erDiagram USER ||--o{ COURSE : instructs USER ||--o{ ENROLLMENT : enrolls USER ||--o{ PROGRESS : tracks USER ||--o{ NOTIFICATION : receives CATEGORY ||--o{ COURSE : categorizes COURSE ||--o{ LESSON : contains COURSE ||--o{ ENROLLMENT : has LESSON ||--o{ QUIZ : includes LESSON ||--o{ PROGRESS : tracks QUIZ ||--o{ QUESTION : contains QUESTION ||--o{ CHOICE : has USER { ObjectId id PK string username UK string email UK boolean is_instructor boolean is_student string bio string profile_picture } COURSE { ObjectId id PK string title string description ObjectId instructor_id FK ObjectId category_id FK decimal price boolean published datetime created_at } LESSON { ObjectId id PK string title ObjectId course_id FK string content string video_url datetime created_at } ENROLLMENT { ObjectId id PK ObjectId student_id FK ObjectId course_id FK datetime enrolled_at } PROGRESS { ObjectId id PK ObjectId student_id FK ObjectId lesson_id FK boolean completed datetime completed_at }

Technology Stack

Built with modern, production-ready technologies

Angular 18

Modern TypeScript-based framework with reactive forms, routing, HTTP client, and comprehensive component architecture.

Bootstrap 5

Responsive CSS framework for mobile-first design with utility classes and pre-built components.

RxJS

Reactive programming library for handling asynchronous data streams and event-based operations.

Django 4.2

High-level Python web framework with ORM, authentication, admin interface, and comprehensive security features.

Django REST Framework

Powerful toolkit for building Web APIs with serializers, viewsets, authentication, and browsable API interface.

Python 3.12

Latest Python version with improved performance, better error messages, and enhanced type hinting capabilities.

MongoDB 5.0

NoSQL document database for storing courses, lessons, enrollments, and user data with flexible schema design.

Redis 6

In-memory data store for caching, session management, and real-time data processing with sub-millisecond latency.

SQLite 3

Lightweight database for Django authentication and user management with zero-configuration setup.

Docker

Container platform for packaging applications with all dependencies in isolated, portable environments.

Kubernetes

Container orchestration platform for automated deployment, scaling, and management of containerized applications.

Jenkins

Automation server for CI/CD pipelines with build, test, and deployment automation capabilities.

GitHub Actions

Native CI/CD workflows integrated with GitHub for automated testing and deployment on every push.

AWS

Cloud infrastructure with ECS Fargate, RDS, DocumentDB, ElastiCache, and comprehensive monitoring services.

Terraform

Infrastructure as Code tool for provisioning and managing cloud resources with declarative configuration.

Deployment Options

Multiple deployment strategies for different needs and scales

🐳

Docker Compose

Best for: Local development and testing

Quick setup with docker-compose.yml including frontend, backend, MongoDB, and Redis services. Perfect for development environments.

Setup time: 5-10 minutes

Learn More
☸️

Kubernetes

Best for: Self-hosted production environments

Complete Kubernetes manifests for deploying to any K8s cluster with auto-scaling, service discovery, and health monitoring.

Setup time: 30-60 minutes

View Guide
☁️

AWS with Terraform

Best for: Enterprise production deployments

Full Infrastructure as Code with Terraform modules for VPC, ECS, RDS, ElastiCache, CloudFront, and comprehensive AWS services.

Cost: ~$1,400/month

Deploy Now
▲

Vercel + Render

Best for: Quick deployments and MVPs

Simple managed deployment with Vercel for frontend and Render for backend. Includes MongoDB Atlas and Redis Cloud.

Cost: ~$25/month

Live Demo

Deployment Architecture (AWS)

graph TB subgraph "Cloud Infrastructure" subgraph "Frontend Hosting - Vercel" A[Vercel CDN] B[Static Assets] end subgraph "Backend Hosting - AWS ECS" C[Django Application] D[Auto-scaling] end subgraph "Database Services" E[(MongoDB Atlas)] F[(Redis Cloud)] end end subgraph "CI/CD Pipeline" G[GitHub] H[GitHub Actions] I[Docker Build] end A --> B C --> D E --> F G --> H H --> I I --> C B --> C D --> E D --> F style A fill:#000000 style C fill:#ff9900 style E fill:#47a248 style F fill:#dc382d

API Documentation

Comprehensive RESTful API with Swagger documentation

📖

Swagger UI

Interactive API documentation with try-it-out functionality. Test all endpoints directly from your browser with authentication support.

Open Swagger UI
📄

ReDoc

Beautiful API documentation with detailed endpoint descriptions, request/response examples, and schema definitions.

Open ReDoc
📋

OpenAPI Spec

Download the complete OpenAPI 3.0 specification for code generation, testing, and integration with your tools.

Download YAML

Key API Endpoints

Endpoint Method Description Auth Required
/api/auth/login/ POST User login with credentials No
/api/auth/registration/ POST Register new user account No
/api/courses/ GET List all available courses Yes
/api/courses/ POST Create new course Yes (Instructor)
/api/courses/{id}/ GET Get course details Yes
/api/lessons/ GET List all lessons Yes
/api/enrollments/ POST Enroll in a course Yes (Student)
/api/progress/ GET Get learning progress Yes
/api/quizzes/{id}/ GET Get quiz questions Yes
/api/users/ GET List all users Yes (Admin)

Getting Started

Quick setup guide for local development

1. Clone Repository

bash 
git clone https://github.com/hoangsonww/Learning-Management-System-Fullstack.git
cd Learning-Management-System-Fullstack

2. Setup Backend (Django)

bash 
cd LMS-Backend
python -m venv .venv
source .venv/bin/activate  # On Windows: .venv\Scripts\activate
pip install -r requirements.txt
python manage.py migrate
python manage.py createsuperuser
python manage.py runserver

Backend will run on http://localhost:8000

3. Setup Frontend (Angular)

bash 
cd LMS-Frontend/app
npm install
ng serve

Frontend will run on http://localhost:4200

4. Configure Databases

Ensure MongoDB and Redis are running:

bash 
# Using Docker
docker run -d -p 27017:27017 --name mongodb mongo:5.0
docker run -d -p 6379:6379 --name redis redis:6

# Or use MongoDB Atlas and Redis Cloud for production

5. Access the Application

Frontend

http://localhost:4200

Backend API

http://localhost:8000

Admin Panel

http://localhost:8000/admin

API Docs

http://localhost:8000/swagger

Or use Docker Compose for instant setup:

bash 
docker-compose up --build

All services will start automatically with proper networking

Screenshots & UI

Preview of the application interface

Home Page

Home Page

Course Management

Courses

Lesson View

Lessons

Progress Tracking

Progress

API Documentation

Swagger

User Management

Users

Documentation & Resources

Additional guides and references

📘

Architecture Guide

Comprehensive architecture documentation with detailed diagrams, component interactions, and design decisions.

Read Guide
🚀

Deployment Guide

Step-by-step deployment instructions for Docker, Kubernetes, AWS, and managed services with cost estimates.

View Deployment
📝

README

Complete project overview, installation instructions, features list, and troubleshooting guide.

Read README
💻

GitHub Repository

Source code, issues, pull requests, releases, and contributions. Star the repo and contribute!

View Repository