Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/sonalisingh30/react-quiz-app
The "React Quiz App" is a dynamic and engaging web application built with React.js. This project offers a variety of features, including a complete responsive design for seamless use on different devices, a clean and intuitive user interface
https://github.com/sonalisingh30/react-quiz-app
api useeffect
Last synced: about 1 month ago
JSON representation
The "React Quiz App" is a dynamic and engaging web application built with React.js. This project offers a variety of features, including a complete responsive design for seamless use on different devices, a clean and intuitive user interface
- Host: GitHub
- URL: https://github.com/sonalisingh30/react-quiz-app
- Owner: sonalisingh30
- Created: 2024-08-14T10:01:46.000Z (6 months ago)
- Default Branch: main
- Last Pushed: 2024-08-27T12:33:23.000Z (6 months ago)
- Last Synced: 2024-11-15T01:12:07.748Z (3 months ago)
- Topics: api, useeffect
- Language: JavaScript
- Homepage: https://sonali-react-quiz-app.netlify.app
- Size: 623 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 🚀 React Quiz App
The "React Quiz App" is a dynamic and engaging web application built with React.js. This project offers a variety of features, including a complete responsive design for seamless use on different devices, a clean and intuitive user interface, and a timed quiz with a progress bar to track your progress.
As you answer questions, the app instantly updates your score and provides a comprehensive scorecard once the quiz is completed. The quiz also includes an automatic submission feature when the timer runs out.
# Demo
[WEBSITE-Demo](https://sonali-react-quiz-app.netlify.app)
## 🛠️Technology Used
- [React.js](https://reactjs.org/)
## 📋Project Features
- 🌐 Complete Responsive Website: This quiz app is designed to work seamlessly on various devices and screen sizes.
- 🎨 Clean and Simple User Interface: A user-friendly design for an enjoyable quiz experience.
- ⏲️ Timer for Quiz: Each quiz question is timed, adding an element of challenge and excitement.
- 📊 Progress Bar: Keep track of your quiz progress in real-time.
- 📈 Score Update: Instant feedback on your score after answering each question.
- 📜 Score Card: Get a comprehensive scorecard with your quiz results.
- ⏱️ Auto-Submission: The quiz automatically submits when the time is up.## 📚Learning Points
- 📡 Creating a Fake API: Learn how to create and deploy a mock API and integrate it into project.
- ⚙️ State Management: Explore state management techniques using the `useReducer` hook to efficiently handle application state.
- 🔄 Fetching Data with `useEffect()`: Utilize the `useEffect` hook for fetching API data and managing timers.## 📱Responsiveness
