🏆 HTalks Hastaları Dünya Kupası Tahmin Ligi

Predict FIFA World Cup matches with friends and compete in a leaderboard, making the experience more engaging and fun.

• Table of Contents
• About / Overview
• Key Features
• Tech Stack
• Getting Started
• Usage
• Project Structure
• Contributing
• License

Table of Contents

• About / Overview
• Key Features
• Tech Stack
• Getting Started
• Usage
• Project Structure
• Contributing
• License

About / Overview

HTalks Hastaları Dünya Kupası Tahmin Ligi is a platform designed for football enthusiasts to predict FIFA World Cup matches, compete with friends, and climb the leaderboard. The project aims to create a fun and engaging experience, fostering a sense of community among users. By leveraging real-time data and a user-friendly interface, the platform ensures an exciting experience for all participants.

The platform solves the problem of monotony in watching sports by introducing a competitive element. Users can engage with others, share predictions, and enjoy the thrill of possibly topping the leaderboard. This not only enhances the viewing experience but also creates a social aspect, as users can discuss and debate their predictions.

What makes HTalks Hastaları Dünya Kupası Tahmin Ligi notable is its focus on simplicity and accessibility. Without requiring complex setups or financial commitments, users can easily join, predict, and enjoy the competition. The use of real-time data ensures that the platform stays updated and relevant, reflecting the dynamic nature of sports.

Key Features

🏆 Real-Time Match Data — Integrated with The Odds API for current matches and odds ⚡ 24-Hour Sliding Window — Predictions limited to matches within the next 24 hours 🎯 Automated Scoring — Match results are automatically fetched, and points are instantly calculated 📊 Live Leaderboard — Expandable table with search support to view all participants 🔐 Username + Password Auth — Simple registration and login system without requiring an email 💾 Supabase Backend — All matches, predictions, and profiles are stored in the database 🎨 Premium Dark UI — Glassmorphism, neon accents, and micro-animations for a sleek design

Tech Stack

Getting Started

Prerequisites

• Node.js 20+
• Supabase account
• The Odds API key

Installation

# 1. Clone the repository
git clone https://github.com/semjhaydin/htalkslig.git
# 2. Navigate into the project directory
cd htalkslig
# 3. Install dependencies
npm install
# 4. Copy and configure the environment file
cp .env.example .env
# Edit .env to include your Supabase and The Odds API credentials
# 5. Run the development server
npm run dev

Usage

To predict a match, simply navigate to the matches section, select the match you're interested in, and submit your prediction. The leaderboard will automatically update based on the outcomes of the matches.

// Example prediction submission
const matchId = 'MATCH123';
const prediction = {
  homeTeamScore: 2,
  awayTeamScore: 1,
};

// Submit prediction
fetch(`/api/predict/${matchId}`, {
  method: 'POST',
  headers: {
    'Content-Type': 'application/json',
  },
  body: JSON.stringify(prediction),
})
.then((response) => response.json())
.then((data) => console.log(data))
.catch((error) => console.error(error));

Project Structure

htalkslig/
├── public/
├── src/
│   ├── components/
│   ├── hooks/
│   ├── pages/
│   ├── services/
│   ├── utils/
│   ├── App.tsx
│   ├── index.tsx
│   ├── setupTests.ts
├── .env.example
├── LICENSE
├── package.json
├── README.md
├── tsconfig.json

Contributing

1. Fork the repository.
2. Create a new branch for your feature or fix.
3. Implement your changes and commit them.
4. Open a pull request against the main branch.
5. Discuss your changes and await review.

License

This project is licensed under the MIT License.