SmartyPants: React Trivia Quiz

[yogeshtakeo]

Trivia Quiz App

Objective: Build a trivia quiz application that displays multiple-choice questions, tracks the user's score, and saves it using Local Storage.

Requirements:

1. Basic UI:

   • Design a simple UI with HTML and CSS.
   • Display each question with four answer choices.
   • Include a "Next" button to load the next question.

2. Quiz Logic (React):

   • Use React components to structure the app:
     • A main component for the quiz logic.
     • A question component to display each question and its options.
     • A score component to display the user's current score.
   • Use state to keep track of:
     • The current question.
     • The user's selected answer.
     • The current score.

3. Score Persistence:

   • Save the user's high score using Local Storage.
   • On page reload, display the high score if it exists.

4. Event Handling:

   • Use event listeners to:
     • Capture the user's answer selection.
     • Move to the next question.
     • Update the score based on correct answers.

5. Bonus (Optional):

   • Add a "Reset Quiz" button to restart the quiz.
   • Add a timer for each question to increase the challenge.

Deliverables:

• A GitHub repository link to the project.
• A short README.md file explaining the app’s functionality and setup instructions.

Evaluation Criteria:

• Completeness of functionality.
• Code organization and readability.
• Effective use of React components and state management.
• Proper use of Local Storage for score persistence.

Estimated Time: ~1 week