CDL Study Pro — Premium Webapp

A fullstack CDL (Commercial Driver's License) practice test application with 766 questions in English & Arabic, detailed Arabic explanations, and advanced study features.

Features

Study Modes

• Browse — Search, filter, and study all questions with instant answers & explanations
• Quiz — Random, In Order, Exam (50Q timed), Wrong Answers review, Bookmarked review
• Flashcards — Flip to reveal answers and Arabic explanations
• Progress — Track accuracy, questions answered, and performance by category

Bilingual Support

• Full English and Arabic interface
• Arabic explanations (شرح بالعربية) for every question
• RTL layout for Arabic

Premium Features

• Bookmarks — Save questions for later review
• Wrong Answers — Focus practice on mistakes
• Timed Exam — 60 min, 50 questions, 80% to pass
• Progress Tracking — Persisted in localStorage
• Category Filter — 8 CDL test categories

Quick Start

# Install all
npm run install:all

# Run fullstack (backend + frontend)
npm start

• Frontend: http://localhost:5173
• Backend API: http://localhost:3001

Project Structure

CDL/
├── backend/           # Node.js Express API
│   ├── server.js
│   └── data/questions.json   # 766 questions + Arabic explanations
├── frontend/          # React + Vite
│   └── src/
│       ├── App.jsx
│       ├── hooks/useStorage.js   # Progress & bookmarks
│       └── translations.js
├── scripts/
│   └── add-arabic-explanations.js
└── package.json

API Endpoints

Endpoint	Description
GET /api/questions	All questions with Arabic explanations
GET /api/categories	List of categories
GET /api/health	Health check

Categories

• General Knowledge (305)
• Air Brakes (65)
• Combination Vehicles (76)
• Transporting Passengers (65)
• Hazardous Materials (72)
• Tank Vehicles (43)
• Double Triple (44)
• School Bus (96)

Push to GitHub

# Initialize git (if not already)
git init

# Add all files
git add .

# Commit
git commit -m "Initial commit: CDL Study Pro fullstack app"

# Create repo on GitHub, then:
git remote add origin https://github.com/YOUR_USERNAME/cdl-study-pro.git
git branch -M main
git push -u origin main

Roadmap for Premium Product

To maximize value, consider:

1. Professional Arabic translations — Hire native translator for questions/answers
2. User accounts — Sync progress across devices
3. Payment/Subscription — Stripe or similar
4. Mobile app — React Native or PWA
5. AI explanations — Generate personalized explanations
6. Video content — Topic explainers
7. Pass guarantee — Marketing angle