Online Coaching Institute - Phase 1 MVP

A complete web platform for online coaching with live classes, built with React, Node.js, Express, and MongoDB.

Features

Landing Page

• Hero section with call-to-action
• Programs for two age groups (10-17 and 17-22)
• Course categories (Life Coaching, Communication, Language Learning)
• Teachers showcase
• Responsive design

Authentication

• Email/password registration and login
• JWT-based authentication
• Role-based access control (Admin, Teacher, Student)

Student Dashboard

• View enrolled courses
• See upcoming classes
• Join class button (only for enrolled students)
• Secure access to meeting links

Teacher Dashboard

• Create classes with Zoom/Google Meet links
• Schedule classes with date and time
• View enrolled students
• Manage class details

Admin Dashboard

• Create and manage courses
• Assign teachers to courses
• Enroll students in courses
• View all users (teachers and students)

Tech Stack

• Frontend: React 18, TailwindCSS, React Router, Axios
• Backend: Node.js, Express, MongoDB, Mongoose
• Authentication: JWT (JSON Web Tokens)
• Security: bcryptjs for password hashing

Project Structure

coaching-platform/
├── frontend/                 # React application
│   ├── src/
│   │   ├── components/      # Reusable components
│   │   ├── pages/           # Page components
│   │   ├── context/         # Auth context
│   │   └── App.js
│   └── package.json
│
├── backend/                 # Express API
│   ├── src/
│   │   ├── models/          # Mongoose models
│   │   ├── routes/          # API routes
│   │   ├── middleware/      # Auth middleware
│   │   └── server.js
│   └── package.json
│
└── README.md

Setup Instructions

Prerequisites

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

Backend Setup

1. Navigate to backend directory:

cd backend

2. Install dependencies:

npm install

3. Create .env file:

cp .env.example .env

4. Update .env with your configuration:

PORT=5000
MONGODB_URI=mongodb://localhost:27017/coaching-platform
JWT_SECRET=your_super_secret_jwt_key_change_this_in_production
NODE_ENV=development

5. Start the server:

npm run dev

Backend will run on http://localhost:5000

Frontend Setup

1. Navigate to frontend directory:

cd frontend

2. Install dependencies:

npm install

3. Create .env file:

cp .env.example .env

4. Update .env:

REACT_APP_API_URL=http://localhost:5000

5. Start the development server:

npm start

Frontend will run on http://localhost:3000

Testing the Application

1. Create Admin Account

• Go to http://localhost:3000/register
• Fill in details and select "Admin" role
• Click Register

2. Create Teacher Account

• Register another user with "Teacher" role
• Or use Admin dashboard to view teachers

3. Create Student Account

• Register with "Student" role
• Select age group (10-17 or 17-22)

4. Admin Workflow

• Login as Admin
• Go to Admin Dashboard
• Create a course (e.g., "Life Coaching 101")
• Assign a teacher to the course
• Enroll students in the course

5. Teacher Workflow

• Login as Teacher
• Go to Teacher Dashboard
• Click "Create Class"
• Select course, add Zoom/Meet link
• Set date and time
• View enrolled students

6. Student Workflow

• Login as Student
• Go to Student Dashboard
• View enrolled courses
• See upcoming classes
• Click "Join Class" to access meeting link

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 courses
• GET /api/courses/:id - Get course by ID
• POST /api/courses - Create course (Admin)
• PUT /api/courses/:id - Update course (Admin)
• DELETE /api/courses/:id - Delete course (Admin)

Classes

• GET /api/classes/course/:courseId - Get classes for course
• GET /api/classes/student/upcoming - Get student's upcoming classes
• GET /api/classes/:id/join - Get meeting link (enrolled students only)
• GET /api/classes/teacher/my-classes - Get teacher's classes
• POST /api/classes - Create class (Teacher/Admin)
• PUT /api/classes/:id - Update class
• DELETE /api/classes/:id - Delete class

Enrollments

• GET /api/enrollments/my-courses - Get student's enrollments
• GET /api/enrollments/course/:courseId - Get enrolled students
• POST /api/enrollments - Enroll student (Admin)
• DELETE /api/enrollments/:id - Remove enrollment (Admin)

Users

• GET /api/users/teachers - Get all teachers
• GET /api/users/students - Get all students (Admin)
• GET /api/users - Get all users (Admin)
• PUT /api/users/:id - Update user profile

Database Schema

User

• name, email, password (hashed)
• role: admin | teacher | student
• ageGroup: 10-17 | 17-22 (for students)
• bio

Course

• title, description
• category: Life Coaching | Communication | Language Learning
• ageGroup: 10-17 | 17-22
• teacher (reference to User)
• materials (array)

Class

• title
• course (reference to Course)
• teacher (reference to User)
• meetingLink (Zoom/Google Meet URL)
• scheduledAt (date/time)
• duration (minutes)
• status: scheduled | completed | cancelled

Enrollment

• student (reference to User)
• course (reference to Course)
• enrolledAt (date)
• status: active | completed | dropped

Deployment

Backend Deployment (Render)

1. Create account on Render
2. Create new Web Service
3. Connect your GitHub repository
4. Configure:
   • Build Command: cd backend && npm install
   • Start Command: cd backend && npm start
   • Add environment variables (MONGODB_URI, JWT_SECRET)
5. Deploy

Frontend Deployment (Vercel)

1. Create account on Vercel
2. Import your GitHub repository
3. Configure:
   • Root Directory: frontend
   • Framework Preset: Create React App
   • Add environment variable: REACT_APP_API_URL (your Render backend URL)
4. Deploy

MongoDB Atlas (Database)

1. Create account on MongoDB Atlas
2. Create a cluster (free tier available)
3. Create database user
4. Whitelist IP addresses (0.0.0.0/0 for development)
5. Get connection string
6. Update MONGODB_URI in backend .env

Security Features

• Passwords hashed with bcryptjs
• JWT tokens for authentication
• Role-based access control
• Meeting links only accessible to enrolled students
• Protected API routes with middleware

Future Enhancements (Phase 2+)

• Payment integration
• Zoom API integration for automatic meeting creation
• Video recording storage
• Assignment submission
• Progress tracking
• Certificates
• Email notifications
• Chat functionality
• Mobile app

Support

For issues or questions, contact: info@coachinghub.com

License

Proprietary - All rights reserved