Input and Output of our Quiz App

Input and Output of our Quiz App

Unlike forms or login screens, this app deals with user input in a very focused and interactive way.

Input

The app takes input in two stages:

1. Category Selection: At the start, the user selects a quiz category (e.g., General Knowledge, Science, Computers). This selection determines which set of questions will be fetched from the trivia API.

2. Answer Selection: For each question displayed, the user chooses one answer out of four options. Each choice is tracked using React's useState hook and is validated against the correct answer for scoring.

Output

The output of the app includes both immediate feedback and a final result after the quiz:

• The quiz questions are displayed one by one, and after the final question, the user is taken to the results screen.
• The score is calculated based on correct answers and displayed along with the number of incorrect ones.
• A message is shown based on performance, and encouraging messages or prompts appear briefly during the quiz.
• A question counter keeps track of the user’s progress (e.g., Question 5 of 10).

Everything is rendered dynamically using React, and styled with custom CSS for a clean and responsive layout.