A modular, category‑based trivia quiz built with HTML, CSS, and JavaScript, featuring multiple quiz types, dynamic rounds, progress tracking, and a clean UI.
The app supports a wide range of trivia categories:
- 🇬🇧 UK Trivia
- 🦸 DC Universe
- 🎬 Movie Trivia
- 📜 History
- 🌍 Geography
- ⚡ Mythology
- 🎨 Art
- ⚽ Sports
- 🏛️ Politics
- ⭐ Celebrities
- 🐾 Animals
Each category contains 10 questions, except UK/DC/Movie which use multi‑round formats.
index.html— main entry pointsrc/— JavaScript and style sourcespublic/— static assets (if used)package.json— project dependencies and scripts
- Node.js 18+ installed
- npm (comes with Node.js)
npm installnpm run devAfter running the command, open the local URL shown in the terminal (usually http://localhost:5173) to view the app.
npm run buildnpm run previewClaude Code is an AI coding assistant that understands this entire codebase. You can use it to add new quiz categories, fix bugs, or extend the UI — all by describing what you want in plain English.
npm install -g @anthropic-ai/claude-codeThen run it from this project directory:
claudeAdd a new quiz category
Add a new "Science" quiz with 3 rounds of 5 questions each about biology, chemistry, and physics.
Show a countdown timer per question
Add a 15-second countdown timer for each question. If time runs out, mark the answer as incorrect and move to the next question automatically.
Fix or improve behaviour
The final score screen doesn't show which questions I got wrong. Can you add a review section?
Claude Code reads the codebase before suggesting changes, so it will follow the existing patterns in src/quiz.js and src/main.js automatically.
This project is meant for learning and prototyping. It uses Vite for fast local development and bundling.