A timed code quiz with multiple-choice questions.
Built with HTML, CSS, Bootstrap library and JavaScript.
It is required to create a quiz application, which will include multiple-choice questions, a timer, and the possibility to register Highscores.
Main elements:
- Intro section with instructions.
- Questions display with answers displaying in random order.
- Inmediate visual and audio feedback for the asnwered questions.
- A timer.
- Highscores sortered and registered with localStorage.
Additional given characteristics: This app will run in the browser and feature dynamically updated HTML and CSS powered by JavaScript code. It will also feature a clean and polished user interface and be responsive, ensuring that it adapts to multiple screen sizes.
In order to accomplish the challenge, the following steps were executed:
- Understand the challenge and the expected flow for the app.
- Define complementary breakdown pseudo-code.
- Code each breackdown element.
- Test, try and error, and apply corrections.
- Write proper documentation comments to main code parts.
With the described process we were able to create a efficient and responsive quiz application that display questions, provide feedback, show images, provide highscores, all in a friendly manner within the Disney movies context.
The application
The project was uploaded to GitHub at the following repository: https://github.com/jorguzman100/04_Code_Quiz
You can access the deployed application with the GitHup Pages link: https://jorguzman100.github.io/04_Code_Quiz/