🚛 CDL Master Pro

The ultimate Commercial Driver's License study platform — 766 questions, interactive course, quizzes, flashcards, and full bilingual support (English / Arabic).

---

Features

Feature	Description
📚 Interactive Course	Complete CDL manual — 8 chapters, bilingual content (EN/AR), SVG illustrations
📖 Question Bank	766 real CDL questions across 8 categories with smart search, filters, bookmarks
🎯 Practice Quiz	5 quiz modes — Random, In-Order, Exam (timed), Wrong-Only, Bookmarked
🃏 Flashcards	3D flip cards with bilingual explanations for active recall study
🗺️ Study Roadmap	3 guided study plans (7/14/30 day) with daily tasks, memory techniques, milestones
📊 Analytics	Real-time progress tracking by category with accuracy and coverage metrics
🌍 Bilingual	Full English + Arabic support with RTL layout
🧠 Smart Explanations	Explains WHY answers are correct/wrong — not just restating them

CDL Categories Covered

Category	Questions
📋 General Knowledge	305
💨 Air Brakes	100
🚛 Combination Vehicles	78
👥 Transporting Passengers	58
☢️ Hazardous Materials	78
🛢️ Tank Vehicles	43
🔗 Doubles & Triples	48
🚌 School Bus	56

---

Tech Stack

Frontend:  React 19  •  Vite 7  •  CSS Custom Properties  •  Glass-morphism Design
Backend:   Node.js   •  Express 5  •  REST API
Data:      766 CDL questions (JSON)  •  Bilingual content  •  SVG illustrations
Storage:   localStorage (progress, bookmarks, roadmap — no accounts needed)

---

Quick Start

Prerequisites

• Node.js 18+ (download)
• npm (comes with Node.js)

Installation

# 1. Clone the repository
git clone https://github.com/YOUR_USERNAME/cdl-master-pro.git
cd cdl-master-pro

# 2. Install all dependencies (root + backend + frontend)
npm run setup

# 3. Start both servers (backend + frontend)
npm run dev

The app will be available at:

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

Alternative (Manual Start)

# Terminal 1 — Backend
cd backend
npm install
npm run dev

# Terminal 2 — Frontend
cd frontend
npm install
npm run dev

---

Project Structure

cdl-master-pro/
│
├── backend/                      # Express.js API Server (Port 8000)
│   ├── server.js                 # REST API — questions, categories, health
│   ├── package.json              # Backend dependencies (express, cors)
│   └── data/
│       └── questions.json        # 766 CDL questions database
│
├── frontend/                     # React SPA — Vite (Port 3000)
│   ├── index.html                # Entry HTML with meta tags
│   ├── vite.config.js            # Vite config + API proxy to :8000
│   ├── package.json              # Frontend dependencies (react, vite)
│   ├── public/
│   │   └── favicon.svg           # App icon
│   └── src/
│       ├── main.jsx              # React entry point
│       ├── App.jsx               # Main app — all pages, course data, smart explanations
│       ├── App.css               # Premium glass-morphism design system (1400+ lines)
│       ├── index.css             # Global reset
│       ├── api.js                # API client (fetch wrapper)
│       ├── translations.js       # EN/AR translations, study plans, methodology
│       └── hooks/
│           └── useStorage.js     # localStorage hooks (progress, bookmarks, roadmap)
│
├── package.json                  # Root — monorepo scripts (dev, build, setup)
├── .gitignore
└── README.md

API Endpoints

Method	Endpoint	Description
GET	/api/questions	All 766 questions with categories
GET	/api/categories	List of 8 CDL categories
GET	/api/questions/:category	Questions for a specific category
GET	/api/health	Server health check

---

NPM Scripts

Command	Description
npm run setup	Install all dependencies (root + backend + frontend)
npm run dev	Start both backend + frontend in dev mode
npm run dev:server	Start only the backend API server
npm run dev:client	Start only the frontend dev server
npm run build	Build the frontend for production

---

License

MIT