Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 

Repository files navigation

🧠 DevQuiz — Developer Knowledge Quiz App

An interactive quiz app to test your web development knowledge across HTML, CSS, JavaScript, and React — with timed questions, instant feedback, and a results dashboard.

HTML CSS JavaScript

🚀 Live Demo

View Live Demo

📸 Preview

A dark-themed quiz app — pick a category, answer 10 randomized multiple-choice questions against a 15-second timer per question, and see your final score with stats.

✨ Features

  • 4 quiz categories: HTML, CSS, JavaScript, React
  • 10 randomized questions per round (shuffled from a question bank each time)
  • 15-second countdown timer per question with a visual warning state
  • Instant answer feedback — correct/wrong highlighting
  • Animated progress bar tracking quiz completion
  • Results screen with score percentage, correct/wrong count, and average response time
  • Replay or switch category without reloading the page
  • Fully responsive, zero dependencies

🛠️ Built With

  • HTML5
  • CSS3 (Flexbox, Grid, Animations, CSS Variables)
  • Vanilla JavaScript (timers, DOM manipulation, state management)

📂 Project Structure

devquiz-app/
├── index.html      # All HTML, CSS, and JS in a single file
└── README.md

🏃 Run Locally

No build step needed — it's a static HTML file.

git clone https://github.com/Jatinmor89/devquiz-app.git
cd devquiz-app

Then just open index.html in your browser, or use a live server:

npx live-server

🎨 Customization

  • Add more categories or questions by editing the QUESTIONS object in the <script> section
  • Adjust the per-question timer by changing timeLeft = 15 in the startTimer() function
  • Colors are controlled via CSS variables at the top of the <style> block

🧩 How It Works

  1. Pick a category on the start screen
  2. Answer 10 shuffled questions, each with a 15-second timer
  3. Get instant feedback (green = correct, red = wrong)
  4. View your final score, accuracy breakdown, and average time per question
  5. Replay the same category or pick a new one

📄 License

This project is open source and free to use for learning and portfolio purposes.

👤 Author

Jatin

About

A responsive full-stack web application designed for developers to test, hone, and expand their technical knowledge across various programming languages and frameworks.

Resources

Stars

1 star

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages