🎓 LearnItt — AI-Powered Learning Management System

A production-ready, AI-powered Learning Management System connecting students with educators — featuring dual dashboards, Google OAuth, Razorpay payments, Gemini-powered smart search, and real-time course management. Built with the MERN Stack.

🚀 Live Demo: Coming Soon 🐙 GitHub: Coming Soon

---

📌 Table of Contents

• Overview
• Features
• Tech Stack
• Project Structure
• Project Pipeline
• API Endpoints
• Setup & Installation
• Deployment
• Key Implementations

---

📖 Overview

LearnItt is a next-generation, SaaS-level Learning Management System built from scratch using the MERN stack. It provides two distinct dashboards — one for students and one for educators/admins — with secure Google OAuth authentication, AI-powered smart search via Gemini, seamless Razorpay payment integration, resume/image uploads via Multer and Cloudinary, and a sleek, fully responsive UI powered by Tailwind CSS.

Whether you're a student looking to upskill or an educator building your brand, LearnItt delivers a seamless, modern EdTech experience.

---

✨ Features

👤 For Students

• Browse and explore courses with AI-powered smart search (Gemini)
• Enroll in courses via Razorpay payment gateway
• Track learning progress in real time
• View complete enrollment and course history
• Update profile and avatar anytime
• Reset password functionality

🏫 For Educators / Admins

• Create, publish, and manage courses
• Upload course thumbnails and content via Cloudinary
• Edit and update existing course listings
• View enrolled students per course
• Manage educator profile and dashboard
• Track course performance metrics

🔐 Authentication & Security

• One-click Google OAuth 2.0 sign-in
• JWT-based session management with middleware-protected routes
• Secure password reset flow via email
• Role-based access control (Student / Educator / Admin)
• Password encryption with bcrypt

🤖 AI Integration

• Gemini AI-powered Smart Search — intelligent, context-aware course discovery
• Fast and relevant results beyond simple keyword matching

💳 Payments

• Integrated Razorpay payment gateway for seamless course purchases
• Secure order creation and payment verification

🎨 UI / UX

• Modern responsive design with Tailwind CSS
• Clean component-driven architecture
• Mobile-friendly interface across all screen sizes
• Smooth and intuitive navigation

---

🛠️ Tech Stack

Layer	Technology
Frontend	React.js (Vite), Redux Toolkit, React Router, Tailwind CSS, Axios
Backend	Node.js, Express.js, Mongoose, JWT, Bcrypt, Multer
Database	MongoDB
Storage	Cloudinary (images & course media)
Auth	Google OAuth 2.0
Payments	Razorpay
AI	Gemini API (Smart Search)

---

📂 Project Structure

LearnItt/
│
├── backend/
│   ├── controllers/       # Route logic (user, course, payment, auth)
│   ├── middleware/        # Auth guards & role-based access
│   ├── models/            # Mongoose schemas (User, Course, Enrollment, Order)
│   ├── routes/            # API route definitions
│   ├── utils/             # Helper functions (email, cloudinary config)
│   └── index.js           # Server entry point
│
├── frontend/
│   ├── src/
│   │   ├── components/    # Reusable UI components (Navbar, CourseCard, etc.)
│   │   ├── hooks/         # Custom React hooks
│   │   ├── redux/         # Redux store & slices (auth, course, user)
│   │   ├── pages/         # Route-level page components
│   │   └── App.jsx
│   └── package.json
│
└── README.md

---

🔄 Project Pipeline

User visits LearnItt
       ↓
Google OAuth / Register / Login (JWT issued)
       ↓
Role Detection (Student / Educator / Admin)
       ↓
     ┌────────────────────────────────────────┐
     │  Student              │   Educator     │
     │  AI Smart Search      │  Create Course │
     │  Browse & Enroll      │  Edit Course   │
     │  Razorpay Payment     │  View Students │
     │  Track Progress       │  Manage Dash   │
     └────────────────────────────────────────┘
       ↓
Redux State persisted across 10+ pages
       ↓
MongoDB ← REST API (15+ endpoints) → React UI
       ↓
Cloudinary (Media) + Razorpay (Orders) + Gemini (AI Search)

---

🔌 API Endpoints

Method	Endpoint	Description
POST	/api/v1/user/register	Register new user
POST	/api/v1/user/login	Login & get JWT
POST	/api/v1/user/google	Google OAuth sign-in
POST	/api/v1/user/reset-password	Send reset password email
PUT	/api/v1/user/update-profile	Update user profile & avatar
GET	/api/v1/course/all	Get all courses
POST	/api/v1/course/create	Create a new course (Educator)
PUT	/api/v1/course/edit/:id	Edit an existing course
GET	/api/v1/course/search	AI-powered course search (Gemini)
POST	/api/v1/order/create	Create Razorpay order
POST	/api/v1/order/verify	Verify payment & enroll student
GET	/api/v1/enrollment/my	Get student's enrolled courses
GET	/api/v1/enrollment/course/:id	Get enrollments for a course

15+ REST API endpoints total across User, Course, Order, and Enrollment routes.

---

⚙️ Setup & Installation

1. Clone the repository

git clone https://github.com/DishaDewangan/LearnItt.git
cd LearnItt

2. Backend Setup

cd backend
npm install

Create a .env file in the backend/ directory:

PORT=8000
MONGO_URI=your_mongodb_connection_string
SECRET_KEY=your_jwt_secret_key
CLOUD_NAME=your_cloudinary_cloud_name
API_KEY=your_cloudinary_api_key
API_SECRET=your_cloudinary_api_secret
GOOGLE_CLIENT_ID=your_google_oauth_client_id
GOOGLE_CLIENT_SECRET=your_google_oauth_client_secret
RAZORPAY_KEY_ID=your_razorpay_key_id
RAZORPAY_KEY_SECRET=your_razorpay_key_secret
GEMINI_API_KEY=your_gemini_api_key
EMAIL_USER=your_email_for_notifications
EMAIL_PASS=your_email_password

Start the backend:

npm run dev

3. Frontend Setup

cd frontend
npm install

Create a .env file in the frontend/ directory:

VITE_API_URL=http://localhost:8000/api/v1
VITE_RAZORPAY_KEY_ID=your_razorpay_key_id
VITE_GOOGLE_CLIENT_ID=your_google_oauth_client_id

Start the frontend:

npm run dev

---

🚀 Deployment

The application can be deployed on Render (both frontend and backend).

To deploy your own instance:

1. Create a Render account
2. Connect your GitHub repository
3. Configure all environment variables in the Render dashboard
4. Deploy backend and frontend as separate services
5. Update VITE_API_URL in frontend .env to point to your live backend URL

---

✅ Key Implementations

Feature	Status
User authentication & authorization	✅
Google OAuth 2.0 sign-in	✅
JWT + role-based access control	✅
Reset password via email	✅
AI-powered smart search (Gemini)	✅
Course creation & management	✅
Razorpay payment gateway	✅
Image & media upload (Multer + Cloudinary)	✅
Student enrollment & tracking	✅
Educator dashboard	✅
Student dashboard	✅
Redux state persistence (10+ pages)	✅
Protected routes	✅
Responsive design	✅
Profile update system	✅

---

👩‍💻 Author

Disha Dewangan

---

If this project helped you, consider giving it a ⭐!