CourseGenie

A modern course creation and management platform built with React, TypeScript, MongoDB, and Node.js.

πŸš€ Features

  • User Authentication: Secure JWT-based authentication with MongoDB
  • Course Management: Create, edit, and publish courses
  • AI Integration: AI-powered course content generation
  • Video & Audio Generation: Integrated with Tavus AI and ElevenLabs
  • Role-Based Access: Separate dashboards for instructors and students
  • Responsive Design: Built with Tailwind CSS

πŸ— Architecture

Frontend (React + TypeScript)

  • Framework: React 18 with TypeScript
  • Styling: Tailwind CSS
  • Build Tool: Vite
  • State Management: React Context + Custom Hooks
  • HTTP Client: Axios

Backend (Node.js + Express)

  • Runtime: Node.js with TypeScript
  • Framework: Express.js
  • Database: MongoDB with Mongoose
  • Authentication: JWT tokens
  • Password Hashing: bcryptjs

πŸ“ Project Structure

coursegenie/
β”œβ”€β”€ src/                          # React frontend
β”‚   β”œβ”€β”€ components/              # Reusable UI components
β”‚   β”œβ”€β”€ pages/                   # Route components
β”‚   β”œβ”€β”€ services/               # API services
β”‚   β”œβ”€β”€ hooks/                  # Custom React hooks
β”‚   β”œβ”€β”€ contexts/               # React contexts
β”‚   └── types/                  # TypeScript type definitions
β”œβ”€β”€ server/                      # Node.js backend
β”‚   β”œβ”€β”€ src/
β”‚   β”‚   β”œβ”€β”€ models/             # Mongoose models
β”‚   β”‚   β”œβ”€β”€ routes/             # Express routes
β”‚   β”‚   └── types/              # Backend type definitions
β”‚   └── .env                    # Server environment variables
β”œβ”€β”€ .env                        # Frontend environment variables
└── README.md

πŸ›  Setup Instructions

Prerequisites

  • Node.js (v18 or higher)
  • MongoDB (local or Atlas)
  • npm or yarn

1. Clone the Repository

git clone <repository-url>
cd coursegenie

2. Install Dependencies

Frontend:

npm install

Backend:

cd server
npm install
cd ..

3. Environment Configuration

Frontend (.env):

REACT_APP_API_URL=http://localhost:3001/api
VITE_GEMINI_API_KEY=your-google-gemini-api-key-here
VITE_TAVUS_API_KEY=your-tavus-api-key-here
VITE_ELEVENLABS_API_KEY=your-elevenlabs-api-key-here

Backend (server/.env):

MONGODB_URI=mongodb://localhost:27017/coursegenie
JWT_SECRET=your-super-secret-jwt-key-change-this-in-production
PORT=3001
NODE_ENV=development

4. Start MongoDB

Local MongoDB:

# macOS with Homebrew
brew services start mongodb-community

# Ubuntu/Debian
sudo systemctl start mongod

# Windows
net start MongoDB

Or use MongoDB Atlas (cloud): Update MONGODB_URI in server/.env with your Atlas connection string.

5. Run the Application

Development Mode (both servers):

Terminal 1 (Backend):

cd server
npm run dev

Terminal 2 (Frontend):

npm run dev

The application will be available at:

6. Build for Production

npm run build

πŸ”§ API Endpoints

Authentication

  • POST /api/auth/register - Register new user
  • POST /api/auth/login - Login user
  • GET /api/auth/me - Get current user

Courses

  • GET /api/courses - Get all published courses
  • GET /api/courses/:id - Get specific course
  • POST /api/courses - Create new course (instructor only)
  • PUT /api/courses/:id - Update course (instructor only)
  • DELETE /api/courses/:id - Delete course (instructor only)
  • GET /api/courses/instructor/my-courses - Get instructor's courses

πŸ§ͺ Testing the API

Register a new user:

curl -X POST http://localhost:3001/api/auth/register \
  -H "Content-Type: application/json" \
  -d '{"email":"test@example.com","password":"password123","full_name":"Test User","role":"student"}'

Login:

curl -X POST http://localhost:3001/api/auth/login \
  -H "Content-Type: application/json" \
  -d '{"email":"test@example.com","password":"password123"}'

🚦 User Roles

Students

  • Browse and search courses
  • Enroll in courses
  • Track learning progress
  • View certificates

Instructors

  • Create and manage courses
  • View analytics and stats
  • Generate AI-powered content
  • Track student enrollments

πŸ”Œ AI Integrations

Google Gemini

Used for AI-powered course content generation.

Tavus AI

Integrated for AI video generation and avatars.

ElevenLabs

Integrated for AI voice generation and audio content.

πŸ› Troubleshooting

Common Issues

Build fails with "useAuth is not exported":

  • Clear node cache: rm -rf node_modules/.cache
  • Restart development server

MongoDB connection error:

  • Ensure MongoDB is running
  • Check connection string in server/.env
  • Verify network connectivity for Atlas

CORS errors:

  • Ensure backend is running on port 3001
  • Check REACT_APP_API_URL in frontend .env

πŸ“ Development Notes

Key Changes Made

  1. Migrated from Supabase to MongoDB: Complete backend rewrite
  2. Added JWT Authentication: Secure token-based auth
  3. Modular Service Architecture: Clean separation of concerns
  4. TypeScript Throughout: Full type safety
  5. Production Build Fixes: Resolved export/import issues

Tech Stack Decisions

  • MongoDB: Flexible document database for course content
  • Express.js: Lightweight and fast API framework
  • JWT: Stateless authentication perfect for SPAs
  • Mongoose: Elegant MongoDB ODM with schema validation

🀝 Contributing

  1. Fork the repository
  2. Create a feature branch
  3. Make your changes
  4. Add tests if applicable
  5. Submit a pull request

πŸ“„ License

This project is licensed under the MIT License.

Share this project:

Updates