quiz-web-app

🎯 Quiz Web App

ProfesionĂĄlnĂ­ quiz aplikace pƙevedenĂĄ na modernĂ­ webovou platformu s pokročilĂœmi funkcemi pro sprĂĄvu uĆŸivatelĆŻ a analĂœzu vĂœsledkĆŻ.

🌟 Hlavní funkce

🚀 Quick Start

🌐 Online verze (Produkce)

🏠 Hlavní stránka: https://wimmerj.github.io/quiz-web-app/
🎯 Quiz aplikace: https://wimmerj.github.io/quiz-web-app/frontend_deploy/quiz_app.html
đŸ‘šâ€đŸ’Œ Admin panel: https://wimmerj.github.io/quiz-web-app/web_frontend/admin/
📊 Demo & testy: https://wimmerj.github.io/quiz-web-app/frontend_deploy/

PƙihlaĆĄovacĂ­ Ășdaje pro demo:
Username: admin | Password: admin123

  1. Frontend: https://your-username.github.io/quiz-web-app
  2. Admin panel: https://your-username.github.io/quiz-web-app/admin
    • Username: admin
    • Password: admin123

đŸ’» LokĂĄlnĂ­ development

# 1. KlonovĂĄnĂ­ repository
git clone https://github.com/your-username/quiz-web-app.git
cd quiz-web-app

# 2. Backend setup
cd web_backend
python -m venv venv
venv\Scripts\activate  # Windows
# source venv/bin/activate  # Linux/Mac
pip install -r requirements.txt
python app.py

# 3. Frontend setup
cd ../web_frontend
# Otevƙete index.html v prohlĂ­ĆŸeči nebo:
python -m http.server 8000

đŸ—ïž Architektura

┌─────────────────┐    ┌─────────────────┐    ┌─────────────────┐
│   Frontend      │    │   Backend API   │    │   Database      │
│   (GitHub Pages)│◄──â–ș│   (Render.com)  │◄──â–ș│   (PostgreSQL)  │
└─────────────────┘    └─────────────────┘    └─────────────────┘
         │                       │                       │
         ▌                       ▌                       ▌
  ‱ HTML/CSS/JS          ‱ Flask/Python           ‱ User accounts
  ‱ Admin panel          ‱ JWT auth               ‱ Quiz questions  
  ‱ Responsive UI        ‱ REST API               ‱ Answer history
  ‱ Real-time updates    ‱ Monica AI proxy        ‱ System logs

📁 Struktura projektu

quiz-web-app/
├── đŸ–„ïž web_backend/           # Flask API server
│   ├── app.py                # Hlavní aplikace
│   ├── requirements.txt      # Python dependencies
│   ├── render.yaml          # Render.com config
│   └── migrate_data.py      # Data migration
├── 🌐 web_frontend/          # Frontend aplikace
│   ├── index.html           # Úvodní stránka
│   ├── quiz_app.html        # Quiz rozhraní
│   ├── api-client.js        # API komunikace
│   └── admin/              # Admin panel
│       ├── index.html       # Admin UI
│       ├── admin.js         # Admin logika
│       └── admin-styles.css # Admin styly
├── 📩 frontend_deploy/       # PƯvodní frontend (backup)
├── đŸ’Ÿ backend_local/         # PĆŻvodnĂ­ backend (backup)
├── 🔄 .github/workflows/     # CI/CD automation
├── 📚 DEPLOYMENT_GUIDE.md    # Návod na deployment
├── 🧭 MIGRATION_TO_WEB_COMPLETE.md # Kompletní migrace
└── 📖 README.md             # Tento soubor

🔧 Technologie

Backend

Frontend

DevOps

📊 API Endpoints

Autentifikace

POST /api/auth/register     # Registrace uĆŸivatele
POST /api/auth/login        # Pƙihláơení
GET  /api/auth/profile      # Profil uĆŸivatele

Quiz

GET  /api/quiz/tables       # Seznam tabulek s otĂĄzkami
GET  /api/quiz/questions/<table>  # OtĂĄzky z tabulky
POST /api/quiz/answer       # UloĆŸenĂ­ odpovědi

Admin (vyĆŸaduje admin prĂĄva)

GET  /api/admin/users       # Seznam vĆĄech uĆŸivatelĆŻ
GET  /api/admin/statistics  # Systémové statistiky
PUT  /api/admin/user/<id>/role  # Změna role uĆŸivatele

Monica AI

POST /api/monica/evaluate   # AI vyhodnocení odpovědi

Systém

GET  /api/health           # Health check

🎼 Jak pouĆŸĂ­vat

Pro studenty:

  1. Registrace - Vytvoƙte si Ășčet na hlavnĂ­ strĂĄnce
  2. Pƙihláơení - Pƙihlaste se a vyberte si tabulku otázek
  3. Quiz - OdpovĂ­dejte na otĂĄzky a sledujte svĆŻj pokrok
  4. Statistiky - ProhlĂ­ĆŸejte si svĂ© vĂœsledky a pokrok
  5. AI vyhodnocenĂ­ - ZĂ­skejte detailnĂ­ feedback od AI

Pro administrĂĄtory:

  1. Admin panel - Pƙihlaste se do admin rozhraní
  2. SprĂĄva uĆŸivatelĆŻ - Vytváƙejte, upravujte a mazejte Ășčty
  3. Statistiky - Sledujte vyuĆŸitĂ­ systĂ©mu a vĂœkonnost
  4. NastavenĂ­ - Konfigurujte systĂ©m podle potƙeb
  5. Monitoring - Sledujte logy a aktivitu v real-time

🔒 Bezpečnost

📈 Monitoring a Analytics

Render.com Dashboard

Admin Panel Analytics

🚀 Deployment

AutomatickĂœ deployment

Aplikace se automaticky deployuje pƙi push do main branch díky GitHub Actions.

ManuĂĄlnĂ­ deployment

Sledujte DEPLOYMENT_GUIDE.md pro detailnĂ­ nĂĄvod.

Prostƙedí

🆙 Upgrade z lokální verze

Pokud pouĆŸĂ­vĂĄte pĆŻvodnĂ­ lokĂĄlnĂ­ Python aplikaci:

  1. Data migrace - PouĆŸijte migrate_data.py pro pƙevod SQLite → PostgreSQL
  2. URL aktualizace - Aktualizujte API endpoints ve frontend kĂłdu
  3. Testing - Otestujte vĆĄechny funkce v novĂ©m prostƙedĂ­
  4. Gradual rollout - Postupně pƙechĂĄzejte uĆŸivatele na novou verzi

💡 Budoucí vylepơení

Plånované funkce:

Technické vylepƥení:

đŸ€ PƙispĂ­vĂĄnĂ­

  1. Fork repository
  2. Vytvoƙte feature branch (git checkout -b feature/AmazingFeature)
  3. Commitněte změny (git commit -m 'Add some AmazingFeature')
  4. Pushněte branch (git push origin feature/AmazingFeature)
  5. Otevƙete Pull Request

📝 Licence

Tento projekt je licencovĂĄn pod MIT License - podrobnosti viz LICENSE soubor.

📞 Podpora

🏆 Úspěchy

📊 Statistiky

Vytvoƙeno s ❀ pro vzdělĂĄvĂĄnĂ­ a testovĂĄnĂ­ znalostĂ­

Migrace z lokĂĄlnĂ­ Python aplikace na modernĂ­ webovou platformu - Leden 2025