Magnificent Quiz is a Quiz App, where users can play quizzes by category.
- HTML
- CSS
- JavaScript
- ReactJS
- Firebase (for backend)
- Login button
- Dark Mode Toggle Button
- All time Popular Quiz
- Trending Categories
- a modal listing rules
- Start quiz button
Play the quiz having 20 second timer for each question.
UI
- Image related to question
- timer showing countdown
- question number
- score
Functionality
- select the answer
- if correct show's green color
- if wrong show's red color
- current score
- highest score
- total score
- buttons to navigate to leaderboard or category page
- Show all quizes category
- on clicking any category quiz starts
- Input first and last name
- Input email address
- Input Password and verify password by click show password button
- confirm password
- User agreement checkbox
- Create new account button
- Already have an account button
- Input Username
- Input password
- Remember me option (ONLY UI)
- Forgot password option (ONLY UI)
- Login button
- Login with Google button
- Login with Facebook button
- Dummy login data preloaded
- Create a New Account button
- All pages are made responsive with respect to mobile screens with width greater than 320px
- Theme can be toggled between light mode and dark mode by clicking the toggle located at the top-right corner of every page.
- Theme will remain persistent between different browser sessions. (Implemented local storage to store theme memory)
To run this app locally on your machine, clone the repo to your local machine.
1. `git clone https://github.com/PuneetP16/magnificent-quiz.git`
2. `cd magnificent-quiz`
In the project directory, you can run
3. `npm install`
4. `npm start`
This will start the app in development mode.
Open http://localhost:3000 to view it in your browser.
Make sure you have access to internet to make use of the API call inside the App.