Utah Football Hub
Full real-time Utah Football ecosystem - HTML, CSS, JavaScript, Cloudflare Workers
Utah Football Hub is a full data-driven platform that aggregates live Utah Football information including scores, stats, roster data, news, matchup breakdowns, and NFL alumni tracking all powered by a custom serverless API layer I built using Cloudflare Workers. The entire system handles multi-source data normalization, caching, mobile optimization, and real-time updates during game weekends.
Role: Full-Stack Developer - HTML, CSS, JavaScript, Cloudflare Workers
Key Features & Technical Implementation
API Integration & Multi‑Source Data Normalization
Built a highly modular Cloudflare Workers API that integrates data from ESPN, TheScore, Utah Athletics (multiple APIs), Fox Sports, CBS Sports, NewsAPI, YouTube Data API, and SportsData.io. Each endpoint performs schema normalization, CORS handling, fallback merging, and error‑tolerant transformation into a unified JSON model. This ensures accurate, fast responses even when external APIs are inconsistent or unavailable.
Dynamic Schedule, Standings & Live Game Updates
Implemented a reconstructed schedule system that merges ESPN and TheScore data into a single clean format, showing matchup details, status, broadcast networks, and venue info. Big 12 standings are fetched and normalized from ESPN. During game weekends, Workers switch to shorter TTL caching for near real time updates.
Automated News Aggregation & YouTube Integration
Created a unified news feed that aggregates articles from Utah Athletics RSS, ESPN, FOX Sports, CBS, NBC, On3, and more. Articles are normalized to consistent formatting with thumbnails and summaries. Also integrated YouTube content pulled from 10+ curated CFB channels, automatically sorted by publication time.
Responsive Multi-View Roster System
Developed a fully interactive roster page with three modes - card, list, and table each supporting sorting by jersey number, name, position group, and class year. Implemented a real-time search bar, adaptive grid scaling, and mobile-optimized player cards. Player profiles include bios, season stats, career stats, and ESPN/UtahUtes game logs processed through custom normalization functions.
Mobile-First UI & Responsive Layout System
Designed every page with a mobile-first approach, using CSS Grid and Flexbox for reflowing layouts, scrollable stat tables, responsive matchup cards, and compressed navigation. Ensures full usability across phones, tablets, and large desktop screens without layout breaking.
Performance Optimization & Edge Caching
Optimized the platform using Cloudflare KV caching, Worker-level cache control, browser session storage, and request deduplication. Implemented dynamic TTL logic: 60s for live games, 2 hours on weekends, 24 hours mid-week. Reduced page load times by over 60% with image compression, prefetching, and minimal JavaScript architecture.
Technical Architecture
The backend is powered entirely by Cloudflare Workers acting as the API gateway for the entire site. Each Worker endpoint fetches from multiple sports APIs, transforms the data into a unified structure, and caches it at the edge. KV caching is used with dynamic TTL logic short refresh cycles for live games, medium TTL for weekends, and long TTL for stable midweek data.
Normalization handles schema differences between providers: ESPN, TheScore, UtahUtes.com, Fox Sports, SportsData.io, YouTube, NewsAPI, and more. A custom transformation pipeline merges box scores, play-by-play, game summaries, stat leaders, and roster data.
The frontend is built with plain JavaScript, HTML, and CSS no frameworks for maximum speed and control. It uses async/await for API calls, session caching, scrollable tables, responsive components, and layout reflow logic for small screens.
Gallery
