Bet Site

A comprehensive sports betting application built with Django REST Framework and React.

Project Status

Current Features

Authentication System

• JWT-based authentication
• User registration
• User login
• Email verification
• Password reset functionality

User Balance Management

• View current balance
• Add balance functionality

Betting System

• Home page with available bets
• Create new bets
• Place bets on available events
• View user's active bets
• Bet results processing (When the status of the match is changed to finished)
• Winnings calculation
• Persistent bet selections with auto-validation on page refresh

League and Matches System

• Browse leagues
• View league details
• View upcoming and past matches
• Match status tracking

UI/UX Features

• Responsive design using Tailwind CSS
• Toast notifications for user feedback
• Dynamic forms with validation
• Error handling
• Card-based match display

System Requirements

• Python 3.12+
• Node.js 18+
• NPM 9+

Installation and Setup

Backend Setup

1. Clone the repository

   git clone https://github.com/yourusername/bettting-site.git
   cd bettting-site
   

2. Set up environment variables

   cd server
   cp .env.example .env
   # Update SECRET_KEY
   

3. Set up Python virtual environment

   python -m venv venv
   source venv/bin/activate  # On Windows: venv\Scripts\activate
   

4. Install dependencies and set up database

   cd server
   pip install -r requirements.txt
   python manage.py migrate
   python manage.py add_initial_data # Optional
   python manage.py runserver
   

League and Match Setup

1. Add a new league through Django admin panel

   # First, create a superuser if you haven't already
   python manage.py createsuperuser
   
   # Access Django admin at http://localhost:8000/admin/
   # Navigate to Sports > Leagues > Add League
   

2. Configure league data source

   • Set league name and associate with a sport
   • Set data source to "flashscore"
   • Add source URL from Flashscore (e.g., "https://www.flashscore.com/football/england/premier-league/fixtures/")
   • Mark as active and save

3. Import matches using management command

   # Import matches for all active leagues
   python manage.py import_matches
   
   # Import matches for a specific league (replace LEAGUE_ID with actual ID)
   python manage.py import_matches --league_id=LEAGUE_ID
   
   # Run import asynchronously using Celery (requires Celery setup)
   python manage.py import_matches --async
   
   # Run import odds
   python manage.py import_upcoming_odds
   

4. Schedule regular updates (optional)

   • Set up a cron job or use Celery beat to run import_matches periodically
   • Configure Celery for asynchronous processing in production

Individual Bet Settlement System per Sport

The bet settlement logic is modular and extensible. Each sport can have its own settlement strategy, making it easy to implement sport-specific rules for evaluating bets.

Structure Overview

• Settlement Base Class:
  All settlement strategies inherit from the abstract Settlement class, which defines the interface for settling a bet.

• Settlement Factory:
  The SettlementFactory selects the appropriate settlement strategy based on the sport type (e.g., "football").
  Example:

  settler = SettlementFactory.create_settlement(match.league.sport.name)

• Sport-specific Settlement:
  Each sport has its own class, e.g. FootballSettlement, implementing the logic for settling bets for that sport.

• Integration with Bet Model:
  The Bet model calls the correct settlement logic via its settle_bet() method:

  def settle_bet(self) -> None:
      if not self.is_settled:
          from sports.services.settlement import SettlementFactory
          settler = SettlementFactory.create_settlement(self.match.league.sport.name)
          if settler:
              settler.settle_bet(self)
          self.bet_slip.settle_slip()

• Extending for New Sports:
  To add a new sport, create a new settlement class (e.g. BasketballSettlement) and update the factory method.

Example

• For football, the FootballSettlement class determines the result based on match scores and bet type.
• The system can be easily extended for other sports by adding new settlement classes.

Celery & Automatic Import of Matches and Odds

Requirements

• Redis (as a broker for Celery)

1. Install Redis (macOS)

brew install redis
brew services start redis

2. Install Redis (Linux)

sudo apt install redis-server
sudo systemctl start redis

3. Check if Redis is running

redis-cli ping
# Should return: PONG

4. Running Celery

In one terminal, start the worker:

celery -A server worker -l info

In another terminal, start the beat scheduler:

celery -A server beat -l info

5. Automatic Task Schedule

• Import matches: daily at midnight (00:00)
• Import odds: every 1 hour (you can change this in server/server/celery.py)

The configuration is in server/server/celery.py:

app.conf.beat_schedule = {
    'import-matches-daily': {
        'task': 'sports.tasks.import_all_league_matches',
        'schedule': crontab(hour=0, minute=0),
        'kwargs': {'scheduled': True},
    },
    'import-upcoming-matches-odds': {
        'task': 'sports.tasks.import_upcoming_matches_odds',
        'schedule': timedelta(hours=1),
    },
}

6. Manual Import

You can also run the import manually using a management command or from the Django shell.

---

Note:
Celery worker and beat must be running for automatic import to work!

Frontend Setup

1. Install dependencies and start development server

   cd client
   npm install
   npm run dev
   

2. Access the application at http://localhost:5173

API Documentation

• Swagger UI: http://localhost:8000/swagger/
• ReDoc: http://localhost:8000/redoc/

Project Structure

• server/ - Django Backend
  • accounts/ - User management and authorization
  • sports/ - Sports betting management
• client/ - React Frontend
  • src/components/ - React components
    • atoms/ - Basic UI components
    • molecules/ - Composite components
    • organisms/ - Complex components combining molecules
    • ui/ - Reusable UI components (shadcn/ui)
  • src/pages/ - Application pages
  • src/services/ - API integration
  • src/context/ - React contexts for state management
  • src/hooks/ - Custom React hooks

Technologies

Backend

• Django
• Django REST Framework
• Simple JWT
• drf-yasg (Swagger/OpenAPI)

Frontend

• React
• React Router
• Axios
• Tailwind CSS
• shadcn/ui
• React Hook Form
• Radix UI primitives