Chocolate Quiz

People like to take quizzes for fun. This quiz on chocolate ask you 15 questions. It tracks the number of questions you got right and displays the total at the end.

The Process

First, I researched the history of chocolate. Then, I compiled a list of questions. Next, I decided on the structure for the quiz. It should display a question, a list of answers and track the number of questions that you get right. Finally, it shows you summary of how well you did at the end. Plus, it asks if you want to try again.

Chocolate Quiz Prototype
Chocolate Quiz

I started with a simple quiz tutorial and modified it. First, I edited the code to include my questions on chocolate. Then, I looked at a quiz example with a timer and modified my code to add question counter.

I wanted to add a sticky footer to the bottom of the page. The web page uses FlexBox. I had to modify the layout to create the footer using FlexBox. After some research, I found an article on CSS-Tricks that helped me create a sticky footer.

The following skills and technologies I used to build this site:

  • JavaScript
  • HTML and CSS
  • FlexBox
  • UI/UX

The Result

A quiz on chocolate creating with HTML, CSS and JavaScript.

Website:  Chocolate Quiz

Chocolate Quiz