https://github.com/ahmed-yasser-66/react-quizapp

A nice react quiz app !
https://github.com/ahmed-yasser-66/react-quizapp

context-api json-server reactjs usereducer-hook

Last synced: 16 days ago
JSON representation

A nice react quiz app !

• Host: GitHub
• URL: https://github.com/ahmed-yasser-66/react-quizapp
• Owner: Ahmed-yasser-66
• Created: 2024-12-31T17:39:06.000Z (about 1 month ago)
• Default Branch: main
• Last Pushed: 2024-12-31T18:09:56.000Z (about 1 month ago)
• Last Synced: 2024-12-31T18:29:18.200Z (about 1 month ago)
• Topics: context-api, json-server, reactjs, usereducer-hook
• Language: JavaScript
• Homepage:
• Size: 0 Bytes
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 🧠 React Quiz App

Welcome to the React Quiz App! This application is designed to help you test your knowledge on react js through an interactive quiz interface. Built with React :o, it leverages the Context API and the `useReducer` hook for state management, and uses JSON Server to simulate data fetching.

## ✨ Features

- 📈 **Score Tracking**: Keep track of your score as you progress through the quiz.

- ⏱️ **Timer**: Each question comes with a countdown timer to add a challenge.

- 🔄 **State Management**: Utilizes React's Context API and `useReducer` for efficient state management.

- 📡 **Data Simulation**: Uses JSON Server to simulate API calls for fetching quiz data.

## 🛠️ Technologies Used

- ⚛️ **React**: JavaScript library for building user interfaces.

- 🌐 **Context API**: For managing global state.

- 🔨 **useReducer Hook**: For complex state logic.

- 📄 **JSON Server**: To simulate a REST API.

- 💅 **CSS**: For styling the application.

 ## 🚀 Getting Started

 Follow these steps to get a local copy of the project up and running.

 ### Prerequisites

Ensure you have the following installed on your machine:

- 🖥️ **Node.js**: [Download and install Node.js](https://nodejs.org/)

- 📦 **npm**: Comes with Node.js, but ensure it's up to date.

### Installation

1.**Clone the repository**:

   ```bash

   git clone https://github.com/Ahmed-yasser-66/react-quizApp.git

   cd react-quizApp

   ```

   

2 .**Install dependencies**:

   ```bash

   npm install

   ```

3. **Set up JSON Server**:

  Install JSON Server globally if you haven't already:

  ```bash

npm install -g json-server

```

  4.**Start the JSON Server**:

  ```bash

json-server --watch data/db.json --port 8000

```

 5.**Start the React application**:

```bash

npm start

```

The app should now be running at http://localhost:3000.

## Enjoy coding 👨‍💻