EduPlatform - Micro-Learning Educational Platform

A full-stack educational web platform where teachers upload notes and students access them as micro-learning lessons (Instagram-style scrollable cards).

🌟 Features

For Students 👩‍🎓

• Role-based Authentication - Separate student login with course/branch/semester selection
• Course Options - B.Tech, M.Tech, BCA, MCA, MBA, B.Sc, M.Sc
• Branch/Department Selection - Comprehensive branches for each course (CSE, ECE, MBA specializations, etc.)
• Micro-Learning Lessons - Bite-sized concepts (2-5 minutes each) in scrollable card format
• Bookmark System - Save important lessons for quick revision
• Revision Mode - Review only bookmarked lessons before exams
• Search & Filters - Find lessons by subject, topic, or keyword
• Dark Mode - Eye-friendly dark theme saved to preferences

For Teachers 👨‍🏫

• Department-wise Upload - Upload notes organized by course, department/branch, and semester
• Notes Upload - Upload PDFs (max 1MB), Google Drive links, or text content
• Auto-Conversion - Notes automatically split into micro-lessons
• Metadata Tagging - Tag by course, branch, semester, and subject
• Preview Selection - See which students will receive the uploaded notes
• Dashboard Analytics - Track views, bookmarks, and engagement
• Content Management - Edit or delete uploaded content

🛠️ Tech Stack

• Frontend: React + Vite + Tailwind CSS
• Backend: Node.js + Express.js
• Database: MongoDB + Mongoose
• Authentication: JWT (JSON Web Tokens)
• File Storage: Cloudinary
• Styling: Tailwind CSS with dark mode support

📁 Project Structure

Educational_website_miniproject/
├── backend/
│   ├── config/
│   │   ├── db.js              # MongoDB connection
│   │   └── cloudinary.js      # Cloudinary configuration
│   ├── controllers/
│   │   ├── authController.js  # Auth logic
│   │   ├── noteController.js  # Notes CRUD + processing
│   │   └── lessonController.js # Lessons & bookmarks
│   ├── middleware/
│   │   └── auth.js            # JWT verification
│   ├── models/
│   │   ├── User.js            # User schema
│   │   ├── Note.js            # Notes schema
│   │   └── Lesson.js          # Micro-lessons schema
│   ├── routes/
│   │   ├── auth.js
│   │   ├── notes.js
│   │   └── lessons.js
│   ├── server.js
│   └── package.json
│
└── frontend/
    ├── src/
    │   ├── components/
    │   │   ├── Layout.jsx      # Main layout with sidebar
    │   │   ├── LessonCard.jsx  # Micro-lesson card component
    │   │   └── Loading.jsx
    │   ├── context/
    │   │   └── AuthContext.jsx # Auth state management
    │   ├── pages/
    │   │   ├── Landing.jsx
    │   │   ├── Login.jsx
    │   │   ├── Register.jsx
    │   │   ├── StudentDashboard.jsx
    │   │   ├── TeacherDashboard.jsx
    │   │   ├── LessonFeed.jsx  # Instagram-style lesson view
    │   │   ├── RevisionMode.jsx
    │   │   ├── UploadNotes.jsx
    │   │   ├── NoteDetail.jsx
    │   │   └── Search.jsx
    │   ├── App.jsx
    │   ├── main.jsx
    │   └── index.css
    ├── index.html
    ├── package.json
    ├── vite.config.js
    └── tailwind.config.js

🚀 Getting Started

Prerequisites

• Node.js (v18+)
• MongoDB (local or Atlas)
• Cloudinary account (for PDF uploads - Free tier: 25GB storage, 1MB per file limit)

Installation

1. Clone the repository

   cd Educational_website_miniproject

2. Set up Backend

   cd backend
   npm install
   
   # Create .env file (copy from .env.example)
   cp .env.example .env
   # Edit .env with your MongoDB URI and Cloudinary credentials
   
   npm run dev

3. Set up Frontend

   cd frontend
   npm install
   npm run dev

4. Access the application

   • Frontend: http://localhost:3000
   • Backend API: http://localhost:5000

Environment Variables

Create a .env file in the backend folder:

PORT=5000
MONGODB_URI=mongodb://localhost:27017/eduplatform
JWT_SECRET=your_super_secret_jwt_key_here
JWT_EXPIRE=7d

# Cloudinary (for PDF uploads)
CLOUDINARY_CLOUD_NAME=your_cloud_name
CLOUDINARY_API_KEY=your_api_key
CLOUDINARY_API_SECRET=your_api_secret

📱 API Endpoints

Authentication

Method	Endpoint	Description
POST	/api/auth/register	Register new user
POST	/api/auth/login	Login user
GET	/api/auth/me	Get current user
PUT	/api/auth/update	Update profile
PUT	/api/auth/darkmode	Toggle dark mode

Notes (Teacher)

Method	Endpoint	Description
GET	/api/notes	Get all notes
POST	/api/notes	Upload new note
GET	/api/notes/:id	Get note with lessons
PUT	/api/notes/:id	Update note
DELETE	/api/notes/:id	Delete note
GET	/api/notes/stats	Get teacher stats

Lessons (Student)

Method	Endpoint	Description
GET	/api/lessons	Get lessons (filtered)
GET	/api/lessons/:id	Get single lesson
GET	/api/lessons/search	Search lessons
POST	/api/lessons/:id/bookmark	Toggle bookmark
GET	/api/lessons/bookmarks	Get bookmarked lessons
GET	/api/lessons/stats	Get student stats
GET	/api/lessons/subjects	Get available subjects

🎨 Features Breakdown

Micro-Learning Cards

• One concept per card (1-3 minutes read)
• Clean layout with title, explanation, code snippets
• Vertical scroll navigation (Instagram-style)
• Bookmark functionality on each card

Notes Processing

When a teacher uploads notes, the system:

1. Parses content using Markdown headers
2. Splits into logical sections
3. Extracts code blocks separately
4. Calculates reading time
5. Creates individual lesson cards

Dark Mode

• Full dark theme support
• Preference saved in database
• Seamless toggle from sidebar

🔮 Future Enhancements

• AI-powered note summarization
• Progress tracking
• Quiz/assessment system
• Push notifications
• Offline mode (PWA)
• Video lessons support
• Discussion forums

📄 License

This project is for educational purposes.

---

Built with ❤️ for better learning experiences