Learning_Management_System/prd.litcoffee at main · bikram73/Learning_Management_System

Project Overview The Learning Management System (LMS) is a web-based platform that enables students to access online courses, watch lessons, and track their learning progress. The platform also provides an Admin dashboard where administrators can manage courses, lessons, and student enrollments.

The system simulates how modern online learning platforms like Coursera, Udemy, and edX work.

This LMS will be built using:

Backend

Python

Flask (or FastAPI)

Database

SQLite (for local development)

PostgreSQL (for deployment)

Frontend

HTML

CSS

JavaScript

Deployment

Vercel

Project Goals Primary Goals Build a functional LMS platform

Understand frontend–backend architecture

Implement authentication system

Implement course management

Implement lesson progress tracking

Implement video-based learning

Learning Goals API design

Database schema design

User authentication

Role-based access control

Deployment workflow

Target Users
Students Students can:

Create accounts

Browse courses

Enroll in courses

Watch lessons

Track progress

Admin Admin can:

Manage courses

Upload lessons

Manage students

Track course usage

System Architecture Architecture Layers

Frontend (HTML + CSS + JS) ↓ Backend API (Python Flask/FastAPI) ↓ Database (SQLite / PostgreSQL) Communication Flow

User → Frontend → API → Database Example Flow:

Student clicks "Course"

Frontend → API request GET /api/courses

Backend → Fetch courses Database → Return courses Frontend → Display courses 5. Tech Stack Component Technology Backend Python Flask / FastAPI Database Local SQLite Database Production PostgreSQL ORM SQLAlchemy Frontend HTML CSS JavaScript Authentication JWT / Session Deployment Vercel Video Hosting YouTube Embedded

Core Features 1 User Authentication System Roles Student

Admin

Authentication Features Signup

Logout

Role-based access

Signup Types Student Signup

Name Email Password Admin Signup

Admin Name Email Password Admin Secret Code 7. Student Dashboard After login students see:

Dashboard Sections My Courses

Browse Courses

Progress Tracker

Continue Learning

Student Workflow

Login ↓ Browse Courses ↓ Enroll Course ↓ Watch Lessons ↓ Mark Lesson Complete ↓ Progress Updated 8. Admin Dashboard Admin controls the LMS.

Admin Features Create Courses

Edit Courses

Delete Courses

Add Lessons

Upload Video Links

Manage Students

View Course Analytics

Course Module Course Information

Course Title Course Description Instructor Name Course Thumbnail Number of Lessons Example

Python Programming Description: Learn Python from basics Instructor: Admin Lessons: 12 10. Lesson Module Each course contains multiple lessons.

Lesson Fields

Lesson ID Lesson Title Lesson Order Video URL Course ID Video Integration Lessons will use YouTube embedded player

Example:

https://www.youtube.com/embed/VIDEO_ID 11. Strict Lesson Ordering Students must follow lesson order.

Example:

Lesson 1 → Unlock Lesson 2 Lesson 2 → Unlock Lesson 3 Logic:

If lesson_completed == true unlock next lesson 12. Progress Tracking The system records student learning progress.

Progress Data

User ID Course ID Lesson ID Completion Status Completion Date Progress Bar Example

Course Progress

██████░░░░░░ 50% 13. Database Design Users Table

users

id name email password role (student/admin) created_at Courses Table

courses

id title description instructor thumbnail created_at Lessons Table

lessons

id course_id title video_url lesson_order created_at Enrollments Table

enrollments

id user_id course_id enrolled_at Progress Table

progress

id user_id lesson_id completed completed_at 14. API Design Authentication APIs

POST /api/signup/student POST /api/signup/admin POST /api/login POST /api/logout Course APIs

GET /api/courses GET /api/course/{id} POST /api/course PUT /api/course/{id} DELETE /api/course/{id} Lesson APIs

GET /api/course/{id}/lessons POST /api/lesson PUT /api/lesson/{id} DELETE /api/lesson/{id} Enrollment APIs

POST /api/enroll GET /api/my-courses Progress APIs

POST /api/lesson/complete GET /api/course-progress/{course_id} 15. UI Pages Public Pages

Home Page Login Page Signup Page Course Listing Page Student Pages

Student Dashboard My Courses Course Details Lesson Page Progress Page Admin Pages

Admin Dashboard Manage Courses Add Course Add Lesson View Students Analytics 16. UI Design Theme Modern dark theme

Color palette:

Background : #0F172A Primary : #2563EB Accent : #38BDF8 Text : #FFFFFF UI Components

Cards Progress bars Course thumbnails Sidebar navigation Video player 17. Project Folder Structure

Learning_Management_System │ ├── backend │ ├── app.py │ ├── models.py │ ├── routes │ ├── services │ └── database.py │ ├── frontend │ ├── index.html │ ├── login.html │ ├── signup.html │ ├── dashboard.html │ ├── course.html │ └── lesson.html │ ├── static │ ├── css │ └── js │ ├── database │ └── lms.db │ └── requirements.txt 18. Deployment Plan Local Development Database:

SQLite Run server:

python app.py Production Deployment Database:

PostgreSQL Host:

Vercel backend API Steps

Push project to GitHub

Connect repo to Vercel

Configure environment variables

Connect PostgreSQL database

Deploy API

Security Features Password hashing

JWT authentication

Admin role protection

API validation

Secure login sessions

Future Improvements Possible upgrades:

Certificates

Quiz system

Discussion forums

AI tutor

Notes system

Course reviews

Mobile responsive UI

Development Roadmap Phase 1 Project setup

Phase 2 Authentication system

Phase 3 Course management

Phase 4 Lesson system

Phase 5 Progress tracking

Phase 6 UI improvement

Phase 7 Deployment

https://www.youtube.com/embed/kqtD5dpn9C

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

users

courses

lessons

enrollments

progress

FilesExpand file tree

prd.litcoffee

Latest commit

History

prd.litcoffee

File metadata and controls

users

courses

lessons

enrollments

progress