Ready for a quick brain teaser? I built this Quizzical Clone, a fun trivia game application inspired by the popular format. It’s designed to test your general knowledge with questions pulled directly from a live database.
This frontend application is built entirely with React. It leverages the power of functional components and hooks (useState
, useEffect
) to manage the game’s state, such as fetching questions, tracking user answers, and calculating the final score. For fetching the trivia questions, it uses Axios to interact with the Open Trivia Database (opentdb.com) API.
Key aspects of building this project included:
- API Integration: Making asynchronous requests to fetch trivia questions using Axios and handling the response data.
- State Management: Using React Hooks (
useState
,useEffect
) to manage the lifecycle of the quiz – from loading questions to displaying results. - UI Development: Creating an interactive and responsive user interface in React to display questions and options, and provide feedback on answers.
- Data Handling: Processing the API data, including decoding HTML entities sometimes present in the questions/answers.
- Deployment: Configuring and deploying the React application using Netlify.
This project was a fantastic way to solidify core React concepts and practice working with external APIs.
Feel free to test your knowledge with the live demo hosted on Netlify, or explore the codebase on GitHub to see how the React components interact and manage the quiz flow.