This is a mini-quiz app built using React Hooks.
This project was built while learning React Basics (Hooks, JSX, Function Components) in Scrimba's Frontend Career Path course. The project uses Open Trivia database API to pull 5 random questions. The App uses State hook to manage screen changes instead of routes. The Figma mockup was provided by Scrimba and the app was built entirely from scratch by me.
-
Two Screens (Start & Questions)
-
Pull 5 questions from the OTDB API
-
The App provides time to read questions and click answers and a button to check answers
-
Tally correct answers after "Check answers" is clicked
-
Styled and polished
Live Link: https://quizz-with-react.netlify.app/
- HTML5
- CSS3
- React
- REST API
This was a great project to get hands on experience working with React Hooks. Also learnt about library html-entities to decode HTML entities in the json response from API. A great experience with Array methods to insert correct answer within array of incorrect answers. I used radio inputs with reduced opacity and made it appear like option buttons which turned out to be a great learning. The major learning was to keep a track of both correct and clicked answer so the outcome can be shown in green and red colors. It was super enjoyable project to work on.
Much Gratitude to Scrimba Mentors and Code Reviewers for their guidance on this project and Frontend Development Path in general