Web AppAPIIn Progress

GameSnap

Live Sports Scores & Predictions

View on GitHub
GameSnap sports platform showing live match scores, league standings, and match prediction interface

Role

Frontend Engineer

Category

Web App · API

Status

In Progress

Outcome

Real-time sports data platform with live scores and match analytics

Tech Stack

ReactTypeScriptReact QueryAPI-FootballTailwind CSS

Overview

GameSnap is a live sports data platform that pulls real-time match scores, league standings, and match statistics from the API-Football data provider. In progress — the foundation is built and the data layer is live.

The Problem

Sports data platforms are either paywalled or ad-saturated. GameSnap is a clean, focused interface for match tracking built as an exploration of real-time data management and React Query's caching model.

Process

React Query handles the polling and caching layer. Live matches poll every 60 seconds automatically; completed matches are cached indefinitely. The query configuration adapts based on match status.

Technical Deep-Dive

The adaptive polling strategy reduces API calls by 80% compared to naive interval polling. Completed matches never re-fetch; live matches poll on a short interval; scheduled matches poll hourly.

Code Sample

Adaptive polling — live matches refresh every 60s, completed matches never re-fetch

typescript
// hooks/useMatch.ts
export function useMatch(matchId: number, status: MatchStatus) {
  return useQuery({
    queryKey: ['match', matchId],
    queryFn: () => fetchMatch(matchId),
    refetchInterval: status === 'LIVE' ? 60_000 : false,
    staleTime: status === 'FINISHED' ? Infinity : 30_000,
    gcTime: status === 'FINISHED' ? Infinity : 5 * 60_000,
  });
}

Results

In progress. The core data layer is live with adaptive polling, league filtering, and live score updates. Match prediction and user favourites are the next features.