This project is a simple quiz app built with React. It utilizes the Open Trivia API to generate random questions based on a selected category.
Demo: Play Quizzie
- Select category and play!
- Celebrate with Confetti!
- Installation
- Usage
- Technologies Used
- Contributing
- Lisence
To run this project, you will need to have Node.js installed on your machine.
- Clone this repository to your local machine using the command below.
git clone https://github.com/10ishq/quizzie.git
- Navigate to the project directory.
cd quizzie
- Install the required dependencies with the following command.
npm install
- Install Tailwind
npm install -D tailwindcss
npx tailwindcss init
- Configure your template paths
Add the paths to all of your template files in your
tailwind.config.js
file
/** @type {import('tailwindcss').Config} */
module.exports = {
content: [
"./src/**/*.{js,jsx,ts,tsx}",
],
theme: {
extend: {},
},
plugins: [],
}
- Add the Tailwind directives to your CSS
Add the @tailwind directives for each of Tailwind’s layers to your ./src/index.css
file.
@tailwind base;
@tailwind components;
@tailwind utilities;
-
Start the development server.
npm start
-
Open https://localhost:3000 to view the app in your browser.
Upon loading the app, the user will be prompted to select a category for the quiz. Clicking on a category will take the user to the first question in the quiz.
The quiz consists of 10 multiple choice questions. The user can select an answer by clicking on one of the provided options. Once an answer has been selected, the user can move on to the next question by clicking the "Next" button.
After answering all 10 questions, the user will be taken to a results page that displays their score out of 10. The user can then click the "Reset" button to restart the quiz.
- React
- TypeScript
- React Router
- React Context API
- Open Trivia API
Contributions are welcome! If you would like to contribute to the project, please follow the steps below.
- Fork the project.
- Create a new branch.
- Make your changes and commit them.
- Push your changes to your fork.
- Submit a pull request.
This project is licensed under the MIT License. See the LICENSE file for details.