File size: 5,587 Bytes
3e247c1 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 |
# Real-Time Quiz Application
A Python-based real-time quiz application designed to mimic the functionality of **Mentimeter**, allowing a host to control the quiz and participants (clients) to join, answer questions, and receive immediate feedback. The application is built using **Flask** and **Socket.IO** for seamless web-based interaction, and it offers a clean, responsive front-end using **HTML**, **CSS**, and **Bootstrap**.
## Features
- **Real-Time Communication**: Uses **Socket.IO** for instant updates between the host and clients.
- **Participant Management**: Tracks connected clients, showing their usernames and responses in real time.
- **Interactive Host Control**: The host can change questions, see live results, and control the flow of the quiz.
- **Simple and Responsive Front-End**: Clean design using Bootstrap for a pleasant user experience across devices.
- **Scalable Design**: Easily expandable to support more questions, features, and visualizations.
## Project Structure
```bash
Real-Time-Quiz-Application/
│
│
├── app.py # Main Flask application
├── backend.py # Backend logic for loading and managing exams
├── templates/
│ ├── index.html # Main index page with client and host buttons
│ ├── client.html # Client interface
│ └── host.html # Host interface
├── static/
│ ├── style.css # Custom styles to mimic the OnVUE exam appearance
│ └── script.js # JavaScript for real-time interactions
├── questions/ # Folder containing exam JSON files
│ ├── exam1.json # Example JSON file for exam 1
│ ├── exam2.json # Example JSON file for exam 2
├── requirements.txt # Python dependencies
└── README.md # Project documentation
```
## Requirements
Ensure you have Python 3.6+ installed. The required dependencies are listed in `requirements.txt`:
- **Flask**: The web framework used for developing the application.
- **Flask-SocketIO**: Enables real-time WebSocket communication between the server and clients.
Install dependencies with:
```bash
pip install -r requirements.txt
```
## How to Run the Application
1. **Clone the repository**:
```bash
git clone https://github.com/ruslanmv/Real-Time-Quiz-Application.git
cd Real-Time-Quiz-Application
```
2. **Install dependencies**:
```bash
pip install -r requirements.txt
```
3. **Run the application**:
```bash
python app.py
```
4. **Access the application**:
- **Host interface**: [http://127.0.0.1:5000/host](http://127.0.0.1:5000/host)
- **Client interface**: [http://127.0.0.1:5000/client](http://127.0.0.1:5000/client)
## Application Overview
### Host Interface
The host controls the flow of the quiz:
- **View Questions**: See the current question and available options.
- **Next Question**: Advance to the next question.
- **Live Results**: View participant responses and statistics in real time.
### Client Interface
Participants join the quiz and interact with the questions:
- **Join the Quiz**: Enter a temporary username to participate.
- **Receive Questions**: Answer questions as they appear, with four possible options.
- **Live Feedback**: See the result of each question based on group responses.
## Demonstration
For demonstration purposes, this version includes only **two questions**. The questions are stored in `app.py` as follows:
```python
questions = [
{"question": "What is the capital of France?", "options": ["Paris", "London", "Berlin", "Rome"]},
{"question": "What is the largest planet?", "options": ["Earth", "Mars", "Jupiter", "Saturn"]}
]
```
### Adding More Questions
To add more questions, simply update the `questions` list in `app.py`. Ensure each question follows the structure:
```python
{"question": "Your question here?", "options": ["Option1", "Option2", "Option3", "Option4"]}
```
## Scaling the Application
This application is built to be easily scalable:
- **Add More Features**: Integrate additional features such as timed questions, answer explanations, or leaderboard tracking.
- **Expand Real-Time Visuals**: Enhance client-side interactivity with more detailed results or progress tracking.
- **Deploy the App**: Use services like **Heroku**, **AWS**, or **Docker** to deploy the application for larger audiences.
## Dependencies
Ensure you have the following dependencies installed, as listed in `requirements.txt`:
```
Flask
Flask-SocketIO
```
### Installing Dependencies
```bash
pip install -r requirements.txt
```
## Troubleshooting
- **No participants showing up**: Ensure all participants join the `/client` interface and submit their usernames correctly.
- **WebSocket issues**: Make sure your firewall or browser settings are not blocking WebSocket connections.
- **Server not starting**: Check that Flask and Flask-SocketIO are installed correctly.
## Contributing
Contributions are welcome! Feel free to submit a pull request or open an issue to improve the functionality, design, or documentation of this application.
## License
This project is open-source and licensed under the MIT License.
## Contact
For any inquiries or suggestions, please reach out to:
- **Name**: Ruslan Magana Vsevolodovna
- **Email**: [email protected]
- **GitHub**: [https://github.com/ruslanmv](https://github.com/ruslanmv)
|