Learning Management System (LMS) Project

A comprehensive Learning Management System (LMS) designed for managing course content, students, and instructors. The system offers a rich user experience powered by Next.js, Express.js, AWS DynamoDB, TailwindCSS, and Shadcn.

---

✨ Features

• User Authentication: Secure and scalable authentication with Clerk.
• Dynamic Drag-and-Drop Interface: Organize course modules with a smooth drag-and-drop UI.
• Rich Media Support: Upload and manage files, videos, and images using FilePond and AWS S3.
• Elegant UI Components: Pre-styled components using Shadcn and Radix UI for consistent design.
• Lucide Icons: Beautiful and customizable icons for enhancing the user experience.
• Data Visualization: Interactive charts and visual aids for reporting and insights.
• Scalable Backend: Serverless architecture using AWS Lambda, DynamoDB, and API Gateway.
• Payment Integration: Stripe integration for seamless payment processing.
• Form Validation: Robust and type-safe form validation using React Hook Form and Zod.
• Deployment: Scalable and secure deployment using AWS services and Docker.

---

📸 Screenshots

Frontend User Interface

Live Demo

🌐 Deployed Infrastructure

The LMS project is deployed using AWS services for scalability, reliability, and performance:

• AWS Lambda: Serverless compute for executing backend functions.
• AWS DynamoDB: NoSQL database for fast and reliable data storage.
• AWS S3: File storage for images, videos, and other media.
• AWS CloudFront: CDN for low-latency content delivery.
• AWS API Gateway: API management for backend endpoints.
• Docker: Containerization for easy and consistent deployment.

📦 Frontend Dependencies

Key Packages

• Next.js: Framework for server-side rendering and static site generation.
• @clerk/nextjs: Authentication made simple with Clerk integration.
• React Redux: State management using Redux Toolkit.
• TailwindCSS: Utility-first CSS framework for styling.
• Shadcn: Beautiful, accessible, and composable UI components powered by Radix.
• Lucide Icons: Modern, customizable icon library for intuitive interfaces.
• Framer Motion: Animation library for smooth transitions.
• FilePond: Advanced file upload with image preview and EXIF orientation.

DevDependencies

• TypeScript: Static type checking.
• ESLint: Linting for clean and consistent code.
• Prettier: Code formatting for a readable codebase.

---

📦 Backend Dependencies

Key Packages

• Express.js: Fast and lightweight web server framework.
• @aws-sdk/client-dynamodb: AWS SDK for interacting with DynamoDB.
• Dynamoose: Simplified modeling and data management for DynamoDB.
• Stripe: Payment gateway integration.
• Helmet: Security middleware for HTTP headers.

DevDependencies

• TypeScript: Provides static type definitions.
• Nodemon: Automatic server restarts during development.
• Rimraf: Cross-platform file deletion.
• Concurrently: Run multiple processes simultaneously.

---

🚀 Tech Stack

Frontend	Backend	Database	Styling
Next.js, Shadcn, React, TailwindCSS	Express.js, Node.js	AWS DynamoDB	TailwindCSS

---

📂 Installation and Setup

Frontend

cd client
npm install
npm run dev
cd server
npm install
npm run dev