Back to Projects
EdTech / Marketplace
Completed
Featured
EduSkill Marketplace System (EMS)
A multi-role web platform connecting training providers with learners — enabling course discovery, enrollment, progress tracking, and administrative oversight.
Production Ready
3
User Roles
25+
Dashboard Modules
5+
Security Layers
Overview
About This Project
EduSkill Marketplace System (EMS) is a web-based platform that bridges the gap between training providers and learners, solving the real-world problem of fragmented skill development and lack of a centralized marketplace where quality training content meets motivated learners.
The system provides a unified interface for course discovery, enrollment, payment handling, and progress tracking across three distinct user roles.
Learners can browse courses with advanced filtering (category, level, instructor, price range), enroll, add to cart/wishlist, track learning progress, earn downloadable certificates, and manage their profile.
Training Providers can register as instructors, create and manage courses with structured curriculum (sections and lessons with rich metadata), view student enrollments and analytics, and respond to reviews.
Admin Officers approve provider registrations, manage all users (learners and providers), oversee course listings, and view analytical reports and system statistics.
The system features prepared SQL statements for security, session-based authentication with CSRF token validation, bcrypt password hashing, and a modular architecture with independent dashboard modules for each role.
Built as a BIT210 Web Programming academic project by Group 1, it demonstrates production-quality security practices, responsive design with five carefully crafted breakpoints (1280px, 1080px, 900px, 640px, 520px), and a clean teal-based UI conveying trust and education..
Roles
User Roles
| Role | Description |
|---|---|
| Learner | Browse courses, filter by category/level/price/instructor, enroll, add to cart/wishlist, track progress, earn certificates, manage profile |
| Training Provider | Register as an instructor, create and manage courses with curriculum, sections, and lessons; view student enrollments, analytics, and reviews |
| Admin Officer | Approve provider registrations, manage all users (learners & providers), oversee course listings, view analytical reports and system statistics |
Features
Feature Details
Public Website
| Feature | Details |
|---|---|
| Dynamic Hero Section | Background image with animated typing effect and dual call-to-action (Start Learning / Become an Instructor) |
| Course Catalog | Grid layout with search, category chips, level filter, instructor dropdown with search, and price range filter |
| Course Details Page | Full layout with overview, curriculum (expandable sections with lessons), reviews, instructor bio, sidebar with pricing, enrollment, cart/wishlist, course info grid (duration, lessons, level, language, certificate, students), and share buttons |
| Partnership Institutes | Showcase of partner organizations and institutions |
| Testimonials | User reviews and success stories |
| FAQ Section | Expandable frequently asked questions |
| Support Section | Contact and support information |
| Responsive Design | Fully adaptive layout from desktop to mobile with breakpoints at 1280px, 1080px, 900px, 640px, and 520px |
Learner Dashboard
| Feature | Details |
|---|---|
| Dashboard Overview | Enrolled courses, progress summary, and quick stats |
| Course Management | View enrolled courses with progress tracking |
| Cart & Wishlist | Add/remove courses, save for later |
| Payment History | View past payments and receipts |
| Certificates | Downloadable course completion certificates |
| Profile Management | Update personal details, profile image upload |
| Messages | Communication with instructors |
| Security Settings | Password management and account security |
Provider Dashboard
| Feature | Details |
|---|---|
| Dashboard Overview | Course performance, enrollment stats, and revenue summaries |
| Course Management | Full CRUD for courses with sections, lessons, pricing, and media upload |
| Student Management | View enrolled students and their progress |
| Analytics | Performance metrics and visualizations |
| Reviews | View and respond to student reviews |
| Payment Management | Track earnings and payouts |
| Profile | Instructor profile with bio, image, and credentials |
Admin Dashboard
| Feature | Details |
|---|---|
| Dashboard Overview | System-wide statistics and activity summaries |
| Course Management | Oversee all courses across providers |
| Learner Management | Manage learner accounts, approvals, and status |
| Provider Management | Approve/block provider registrations and manage accounts |
| User Management | Comprehensive user administration across all roles |
| Analytics & Reports | System-wide analytical reports and data exports |
| Settings | System configuration and preferences |
Stack
Technology Stack
| Category | Technology |
|---|---|
| Backend | PHP 8.x (procedural, with prepared statements) |
| Database | MySQL (via XAMPP) |
| Frontend | HTML5 / CSS3 / JavaScript (ES6+) |
| CSS Framework | Bootstrap 5 |
| Icons | Bootstrap Icons + Font Awesome 6 |
| Local Server | XAMPP (Apache + MySQL + PHP) |
| Version Control | Git + GitHub |
| Security | CSRF tokens, password hashing (bcrypt), prepared SQL statements, session-based auth |
Performance
Performance & Architecture
Prepared SQL statements prevent SQL injection and improve query performance
Indexed database schema with foreign key relationships for efficient joins
Session-based authentication with CSRF token validation on all forms
Modular PHP includes — each page section (hero, courses, about, FAQ, etc.) is a reusable partial
Separation of concerns — public pages, learner dashboard, provider dashboard, and admin dashboard are fully independent modules
AJAX API endpoints (learner/api.php, admin-officer/api.php, api/public-courses.php) for asynchronous operations
Dynamic course loading with JavaScript-driven filtering, searching, and pagination
Consistent error handling with user-friendly error pages (custom 404 for missing courses)
Team
Group Members
| Name | ID |
|---|---|
| Aaditya Chaudhary | E2300548 |
| Aakroshan Chaudhary | E2300551 |
| Sandhya Dhami | E2300577 |
Setup
Getting Started
Prerequisites
- XAMPP (Apache + MySQL + PHP 8.x)
- Git (optional, for cloning)
- A web browser
Setup Steps
- 1Clone the repository: git clone https://github.com/iconicaditya/WebProE2300548.git
- 2Move the project folder to XAMPP's htdocs (e.g., C:\xampp\htdocs\WebProE2300548)
- 3Start Apache and MySQL in XAMPP Control Panel
- 4Open phpMyAdmin and create a database named: eduskill_marketplace
- 5Import the SQL schema from: config/eduskill.sql
- 6Open the application in your browser: http://localhost/WebProE2300548/
Challenges
- 1Implementing secure multi-role authentication with distinct dashboard views and permissions for Learners, Training Providers, and Admin Officers, each with role-appropriate tools and data access
- 2Building a comprehensive course catalog with real-time filtering across multiple dimensions (category, level, instructor, price range) using JavaScript-driven live grid updates without page reloads
- 3Creating a structured curriculum builder allowing providers to organize courses into sections and lessons with rich metadata including duration, lesson counts, and media upload
- 4Ensuring robust security across all endpoints including CSRF token validation on all forms, bcrypt password hashing, prepared SQL statements via mysqli_stmt, XSS prevention with htmlspecialchars(), and file upload security with extension whitelist and size limits
- 5Designing a responsive layout that works seamlessly across five breakpoints (1280px, 1080px, 900px, 640px, 520px) with a consistent teal-based design system and glassmorphism effects
Solutions
- 1Developed a role-based session authentication system with dynamic dashboard routing — each role gets a tailored portal with role-appropriate tools, data access, and ems_dashboard_path_for_role() redirect function
- 2Built a JavaScript-driven course catalog with sticky filter sidebar, category chip buttons, instructor search dropdown with search, price range filter, and live grid updates powered by AJAX API endpoints (api/public-courses.php)
- 3Designed a modular course management interface with expandable curriculum sections, lesson organization with duration metadata, course media upload with validation, and pricing management
- 4Implemented defense-in-depth security: CSRF tokens (ems_verify_csrf_token()) on all forms, bcrypt for credential storage, parameterized queries via mysqli_stmt with bound parameters, htmlspecialchars() on all user-supplied output, session_regenerate_id() on login, and file upload whitelist with 5MB limits
- 5Crafted a meticulous responsive design with teal (#0d6e84) color scheme conveying trust and education, glassmorphism effects on hero and course cards, hover animations with smooth transitions, gradient overlays on thumbnails, and consistent spacing across all device sizes
Stack
Technology & Architecture
PHP 8.xMySQLBootstrap 5JavaScript ES6+HTML5CSS3XAMPPAJAXBootstrap IconsFont Awesome 6Prepared StatementsbcryptCSRF Tokens
Design
Design & UX Highlights
Clean, modern UI with Bootstrap 5 components and custom CSS enhancements
Responsive layout with carefully crafted breakpoints at 1280px, 1080px, 900px, 640px, and 520px
Teal-based color palette (#0d6e84 primary) conveying trust and education
Hero section with animated typing effect and dual CTA buttons
Course catalog with sticky filter sidebar, category chip buttons, instructor search dropdown, and live grid filtering
Course cards with hover animations, smooth transitions, and gradient overlays on thumbnails
Course details page with tabbed interface (Overview / Curriculum / Reviews), sticky price sidebar, and related courses carousel
Expandable curriculum modules with lesson counts and duration metadata
Star ratings with half-star support and review timestamps
Filter reset functionality for easy navigation
Glassmorphism effects on hero and course cards with backdrop blur
Security
Security & Access Control
CSRF token validation on all form submissions via ems_verify_csrf_token()
Password hashing with password_hash() using bcrypt algorithm
Prepared SQL statements using mysqli_stmt with bound parameters preventing SQL injection
Session security with session_regenerate_id() on login and role-based access control
Input validation with email validation, numeric casting, and string trimming on all inputs
XSS prevention with htmlspecialchars() on all user-supplied output
File upload security with extension whitelist, 5MB size limits, and dedicated upload directories
Role-based redirects via ems_dashboard_path_for_role() routing users to their correct dashboard
Roadmap
Future Roadmap
Email notifications for enrollment confirmations
Online payment gateway integration
Course progress tracking with video completion
Instructor-student messaging system
Certificate generation with unique verification codes
Advanced analytics with chart visualizations
Multi-language support
API-first architecture for mobile app integration
“EMS demonstrates exceptional attention to security, user experience, and system architecture. The multi-role dashboard design and comprehensive feature set are truly impressive for an academic project.”
B
BIT210 Course Instructor
Web Programming Faculty
Open to Freelance & Contract Projects
Ready to Build Something Exceptional?
Whether you need a full-stack web application, SaaS platform, booking system, or a premium portfolio site — let's architect something production-ready and deployed on Vercel or your preferred cloud.
Next.js App Router
Neon / Supabase DB
Cloudinary Media
Vercel Deployment
Usually responds within 24 hours · Based in GMT+5:45 · Available for international projects