Frontend
# 🌍 Pan-African Kicks - African Nations Fantasy Football Tournament
A comprehensive fantasy football tournament management system featuring real-time match simulations, strategic squad building, and live commentary for African Nations competitions.
---
## đź“‹ Table of Contents
- System Overview
- System Rationale
- System Architecture
- System Components
- Administrator Credentials
- Prerequisites
- Installation & Setup
- Running the Application
- Technology Stack
- Features
- API Documentation
---
## 🎯 System Overview
**Pan-African Kicks** is a full-stack web application that simulates an African Nations fantasy football tournament. The system allows federation representatives to register teams, build squads, and compete in knockout-style tournaments with real-time match simulations, AI-powered commentary, and live score updates via WebSockets.
---
## đź’ˇ System Rationale
### Purpose
The application addresses the need for an engaging, interactive fantasy football platform specifically tailored to African football enthusiasts. It combines:
1. **Competitive Gaming** - Strategic squad building and tournament participation
2. **Real-Time Engagement** - Live match simulations with commentary and scores
3. **Community Building** - Federation-based team management fostering national pride
4. **Educational Value** - Understanding tournament structures, player management, and tactical decisions
### Design Philosophy
- **User-Centric Design**: Intuitive interfaces for different user roles (admins, federation reps, viewers)
- **Real-Time Interaction**: WebSocket integration for live updates without page refreshes
- **Scalability**: MongoDB for flexible data storage, Express.js for robust API handling
- **Security**: JWT authentication, role-based access control, and secure password hashing
- **Responsive Design**: Mobile-first approach using Tailwind CSS for cross-device compatibility
---
## 🏗️ System Architecture
```
┌──────────────────────────────────────────── …