Quizzical

Quizzical is a trivia quiz app built using React.js as part of Scrimba's Frontend Career Path. You can access the live demo of the application here.

Technologies Used

• React.js for building the user interface and handling component-based architecture.
• JavaScript for implementing logic and functionality.
• HTML & CSS for structuring the user interface and applying styles.
• Figma for designing and prototyping the user interface.

Features

• Retrieves five questions from the Open Trivia Database API and presents them to the user.
• Evaluates the user's answers and provides a score based on their responses.
• Implements React's event listeners to handle user interactions and trigger appropriate actions.
• Utilizes conditional rendering techniques to dynamically display content based on different quiz states.
• Effectively manages props and state in React components to maintain the application's state and trigger reactivity.
• Utilizes the useEffect hook to manage side effects, such as fetching data from the API, and perform actions in response to component lifecycle events.

Skills Acquired & Topics Researched

During the development of Quizzical, the following skills were acquired and topics were researched:

• Gained a solid understanding of working with APIs in React.js, including making API calls and handling responses.
• Developed a strong foundation in React.js basics, including component-based architecture, props, state, and lifecycle methods.
• Implemented event listeners in React components to handle user interactions, such as button clicks and form submissions.
• Utilized conditional rendering techniques to dynamically display different components and content based on different quiz states, such as loading, quiz in progress, and quiz completed.
• Effectively managed props and state in React components to maintain the application's state and trigger reactivity to user inputs.
• Utilized the useEffect hook to manage side effects, such as fetching data from the API, and perform actions in response to component lifecycle events.

Installation

To run Quizzical locally, follow these steps:

1. Clone the repository to your local machine.
2. Navigate to the project directory in your terminal.
3. Run npm install to install the necessary dependencies.
4. Run npm start to start the development server.
5. Open your web browser and go to http://localhost:3000 to view and interact with the application.