https://github.com/kadirkarabacak/react-quiz-app

React Quiz-App
https://github.com/kadirkarabacak/react-quiz-app

Last synced: about 2 months ago
JSON representation

React Quiz-App

• Host: GitHub
• URL: https://github.com/kadirkarabacak/react-quiz-app
• Owner: KadirKarabacak
• Created: 2023-12-25T21:13:17.000Z (about 1 year ago)
• Default Branch: main
• Last Pushed: 2024-02-25T20:44:45.000Z (11 months ago)
• Last Synced: 2024-02-25T21:42:01.327Z (11 months ago)
• Language: JavaScript
• Homepage: https://react-quiz-app-k.netlify.app/
• Size: 8.06 MB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# React Quiz-App

In this project i create a responsive simple React Quiz App with React and CSS.

Live Version 🟢 React-Quiz-App Live

## Features of the project 🔷

- One file for each component.

- Error handling for questions fetch.

- Timer that checks the status of the Quiz.

- A progressbar synchronized with your question progress.

- The loader which controls the process until the questions are fetched.

- A welcome screen before starting the exam and an end screen at the end of the exam.

- Highscore feature after you restart the quiz.

- Mixing up the questions when restarting the exam.

- Different score evaluation for easy and difficult questions.

## Which "features" of React did I use?

- Conditional rendering.

- Instead of useState, useReducer which controls different states at once.

- For reducer function switch/case structure.

- Derived state from initial states.

- useEffect hook for fetch quesitons.

- Prop Drilling, children prop and component composition.

- Short Circuiting, destructuring, map, reduce and sort method which is JS feature.

- Key prop on rendering list.

- Cleanup function for clean setInterval sideeffects.