README
Browse files- .github/workflows/sync-to-hf.yaml +1 -6
- README.md +144 -11
.github/workflows/sync-to-hf.yaml
CHANGED
|
@@ -24,9 +24,4 @@ jobs:
|
|
| 24 |
HF_TOKEN: ${{ secrets.HF_TOKEN }}
|
| 25 |
run: |
|
| 26 |
git remote add space https://huggingface.co/spaces/ruslanmv/Real-Time-Quiz-Application || true
|
| 27 |
-
git push --force https://ruslanmv:${HF_TOKEN}@huggingface.co/spaces/ruslanmv/Real-Time-Quiz-Application main
|
| 28 |
-
|
| 29 |
-
# Step to restore original README.md
|
| 30 |
-
- name: Restore GitHub README.md
|
| 31 |
-
run: |
|
| 32 |
-
mv README_GITHUB.md README.md
|
|
|
|
| 24 |
HF_TOKEN: ${{ secrets.HF_TOKEN }}
|
| 25 |
run: |
|
| 26 |
git remote add space https://huggingface.co/spaces/ruslanmv/Real-Time-Quiz-Application || true
|
| 27 |
+
git push --force https://ruslanmv:${HF_TOKEN}@huggingface.co/spaces/ruslanmv/Real-Time-Quiz-Application main
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
README.md
CHANGED
|
@@ -1,15 +1,148 @@
|
|
| 1 |
-
|
| 2 |
-
title: Real Time Quiz Application
|
| 3 |
-
emoji: π₯
|
| 4 |
-
colorFrom: green
|
| 5 |
-
colorTo: pink
|
| 6 |
-
sdk: docker
|
| 7 |
-
pinned: false
|
| 8 |
-
short_description: 'About A Python-based real-time quiz application designed to '
|
| 9 |
-
---
|
| 10 |
|
| 11 |
-
A Python-based real-time quiz application designed to mimic the functionality of Mentimeter
|
| 12 |
|
|
|
|
| 13 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 14 |
|
| 15 |
-
Check out the configuration reference at https://huggingface.co/docs/hub/spaces-config-reference
|
|
|
|
| 1 |
+
# Real-Time Quiz Application
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 2 |
|
| 3 |
+
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**.
|
| 4 |
|
| 5 |
+
## Features
|
| 6 |
|
| 7 |
+
- **Real-Time Communication**: Uses **Socket.IO** for instant updates between the host and clients.
|
| 8 |
+
- **Participant Management**: Tracks connected clients, showing their usernames and responses in real time.
|
| 9 |
+
- **Interactive Host Control**: The host can change questions, see live results, and control the flow of the quiz.
|
| 10 |
+
- **Simple and Responsive Front-End**: Clean design using Bootstrap for a pleasant user experience across devices.
|
| 11 |
+
- **Scalable Design**: Easily expandable to support more questions, features, and visualizations.
|
| 12 |
+
|
| 13 |
+
## Project Structure
|
| 14 |
+
|
| 15 |
+
```bash
|
| 16 |
+
Real-Time-Quiz-Application/
|
| 17 |
+
β
|
| 18 |
+
β
|
| 19 |
+
βββ app.py # Main Flask application
|
| 20 |
+
βββ backend.py # Backend logic for loading and managing exams
|
| 21 |
+
βββ templates/
|
| 22 |
+
β βββ index.html # Main index page with client and host buttons
|
| 23 |
+
β βββ client.html # Client interface
|
| 24 |
+
β βββ host.html # Host interface
|
| 25 |
+
βββ static/
|
| 26 |
+
β βββ style.css # Custom styles to mimic the OnVUE exam appearance
|
| 27 |
+
β βββ script.js # JavaScript for real-time interactions
|
| 28 |
+
βββ questions/ # Folder containing exam JSON files
|
| 29 |
+
β βββ exam1.json # Example JSON file for exam 1
|
| 30 |
+
β βββ exam2.json # Example JSON file for exam 2
|
| 31 |
+
βββ requirements.txt # Python dependencies
|
| 32 |
+
βββ README.md # Project documentation
|
| 33 |
+
```
|
| 34 |
+
|
| 35 |
+
## Requirements
|
| 36 |
+
|
| 37 |
+
Ensure you have Python 3.6+ installed. The required dependencies are listed in `requirements.txt`:
|
| 38 |
+
|
| 39 |
+
- **Flask**: The web framework used for developing the application.
|
| 40 |
+
- **Flask-SocketIO**: Enables real-time WebSocket communication between the server and clients.
|
| 41 |
+
|
| 42 |
+
Install dependencies with:
|
| 43 |
+
|
| 44 |
+
```bash
|
| 45 |
+
pip install -r requirements.txt
|
| 46 |
+
```
|
| 47 |
+
|
| 48 |
+
## How to Run the Application
|
| 49 |
+
|
| 50 |
+
1. **Clone the repository**:
|
| 51 |
+
```bash
|
| 52 |
+
git clone https://github.com/ruslanmv/Real-Time-Quiz-Application.git
|
| 53 |
+
cd Real-Time-Quiz-Application
|
| 54 |
+
```
|
| 55 |
+
|
| 56 |
+
2. **Install dependencies**:
|
| 57 |
+
```bash
|
| 58 |
+
pip install -r requirements.txt
|
| 59 |
+
```
|
| 60 |
+
|
| 61 |
+
3. **Run the application**:
|
| 62 |
+
```bash
|
| 63 |
+
python app.py
|
| 64 |
+
```
|
| 65 |
+

|
| 66 |
+
4. **Access the application**:
|
| 67 |
+
- **Host interface**: [http://127.0.0.1:5000/host](http://127.0.0.1:5000/host)
|
| 68 |
+

|
| 69 |
+
- **Client interface**: [http://127.0.0.1:5000/client](http://127.0.0.1:5000/client)
|
| 70 |
+

|
| 71 |
+
## Application Overview
|
| 72 |
+

|
| 73 |
+
### Host Interface
|
| 74 |
+
|
| 75 |
+
The host controls the flow of the quiz:
|
| 76 |
+
- **View Questions**: See the current question and available options.
|
| 77 |
+
- **Next Question**: Advance to the next question.
|
| 78 |
+
- **Live Results**: View participant responses and statistics in real time.
|
| 79 |
+
|
| 80 |
+
### Client Interface
|
| 81 |
+
|
| 82 |
+
Participants join the quiz and interact with the questions:
|
| 83 |
+
- **Join the Quiz**: Enter a temporary username to participate.
|
| 84 |
+
- **Receive Questions**: Answer questions as they appear, with four possible options.
|
| 85 |
+
- **Live Feedback**: See the result of each question based on group responses.
|
| 86 |
+
|
| 87 |
+
## Demonstration
|
| 88 |
+
|
| 89 |
+
For demonstration purposes, this version includes only **two questions**. The questions are stored in `app.py` as follows:
|
| 90 |
+
|
| 91 |
+
```python
|
| 92 |
+
questions = [
|
| 93 |
+
{"question": "What is the capital of France?", "options": ["Paris", "London", "Berlin", "Rome"]},
|
| 94 |
+
{"question": "What is the largest planet?", "options": ["Earth", "Mars", "Jupiter", "Saturn"]}
|
| 95 |
+
]
|
| 96 |
+
```
|
| 97 |
+
|
| 98 |
+
### Adding More Questions
|
| 99 |
+
|
| 100 |
+
To add more questions, simply update the `questions` list in `app.py`. Ensure each question follows the structure:
|
| 101 |
+
```python
|
| 102 |
+
{"question": "Your question here?", "options": ["Option1", "Option2", "Option3", "Option4"]}
|
| 103 |
+
```
|
| 104 |
+
|
| 105 |
+
## Scaling the Application
|
| 106 |
+
|
| 107 |
+
This application is built to be easily scalable:
|
| 108 |
+
- **Add More Features**: Integrate additional features such as timed questions, answer explanations, or leaderboard tracking.
|
| 109 |
+
- **Expand Real-Time Visuals**: Enhance client-side interactivity with more detailed results or progress tracking.
|
| 110 |
+
- **Deploy the App**: Use services like **Heroku**, **AWS**, or **Docker** to deploy the application for larger audiences.
|
| 111 |
+
|
| 112 |
+
## Dependencies
|
| 113 |
+
|
| 114 |
+
Ensure you have the following dependencies installed, as listed in `requirements.txt`:
|
| 115 |
+
|
| 116 |
+
```
|
| 117 |
+
Flask
|
| 118 |
+
Flask-SocketIO
|
| 119 |
+
```
|
| 120 |
+
|
| 121 |
+
### Installing Dependencies
|
| 122 |
+
|
| 123 |
+
```bash
|
| 124 |
+
pip install -r requirements.txt
|
| 125 |
+
```
|
| 126 |
+
|
| 127 |
+
## Troubleshooting
|
| 128 |
+
|
| 129 |
+
- **No participants showing up**: Ensure all participants join the `/client` interface and submit their usernames correctly.
|
| 130 |
+
- **WebSocket issues**: Make sure your firewall or browser settings are not blocking WebSocket connections.
|
| 131 |
+
- **Server not starting**: Check that Flask and Flask-SocketIO are installed correctly.
|
| 132 |
+
|
| 133 |
+
## Contributing
|
| 134 |
+
|
| 135 |
+
Contributions are welcome! Feel free to submit a pull request or open an issue to improve the functionality, design, or documentation of this application.
|
| 136 |
+
|
| 137 |
+
## License
|
| 138 |
+
|
| 139 |
+
This project is open-source and licensed under the MIT License.
|
| 140 |
+
|
| 141 |
+
## Contact
|
| 142 |
+
|
| 143 |
+
For any inquiries or suggestions, please reach out to:
|
| 144 |
+
|
| 145 |
+
- **Name**: Ruslan Magana Vsevolodovna
|
| 146 |
+
- **Email**: [email protected]
|
| 147 |
+
- **GitHub**: [https://github.com/ruslanmv](https://github.com/ruslanmv)
|
| 148 |
|
|
|