💛
Coding: The process of screaming at a computer monitor for hours until realizing that the problem was a missing semi-colon or comma; ~Urban Dictionary
The quiz allows to test one's knowledge of JavaScript fundamentals with a timed multiple choice quiz. For every wrong answer user is penalised by losing 10 seconds of the remaining time. Upon completion (or time run out) user is able to save their score, so they can challenge themselves over and over, until they get all the answers right.
This app runs in the browser, and features dynamically updated HTML and CSS powered by JavaScript. As always, built with accessibility in mind. Tested in Chrome, Firefox and Opera.
- Interactive timed quiz
- Option for user to select amount of questions (10/15/20)
- Randomised questions, each with 4 randomised answer options
- Time penalty on incorrect answer
- Get 2 points for the correct answer, lose 1 point for incorrect
- Client-side scores saving and display of the top 10 scores (to save memory only the last 100 scores are stored)
- UI and sound effect feedback on correct/incorrect answer choice, variable ending sound based on the reason game ended - either all questions are answered or time runs out
- Option to switch the sound off (on by default)
- Clean, polished and responsive mobile-first design
- It's beautiful 👌
this week material
- JSON
- localStorage
- JS element creation
- Timer function
researched while working on this project
- Audio functions
- JS file & function Import/export and modules
- Input validation: regEx & character limit
- Image by Milad Fakurian, Unsplash
- Bunny Fonts 🐇 & The Baskervville Project Authors
- Freesound 🎵, Correct/incorrect sfx by Sjonas88 & Game over sfx by Baltiyar13
- Pure CSS Speaker icon by Ates Goral
- Pure CSS Arrow icon by Simon Breiter (edited)
- My brain 🧠 for working overtime for the past 6 weeks
Licenced under the CC BY-NC 4.0 license.
Copyright © 2023 Alexandra Batrak