Extra Innings
MLB Companion for Scores, Teams, Standings & Stats
A custom MLB companion built with the App Router. It pulls live and seasonal data from the public MLB Stats API and presents it in a clean, responsive UI with light/dark themes. Fans can browse all 30 clubs, follow favorite teams (persisted in localStorage), check division standings, view hitting/pitching leaders, and dig into individual games and team rosters.
The live app is public; the source repository is private.
The Problem
Official MLB data is public, but browsing it as a fan means jumping between scores, standings, rosters, and leaderboards that don’t share a coherent product UI — and most starter templates don’t model that API with real types or App Router patterns.
The Solution
Extra Innings is a typed MLB companion: live and daily scores, a 30-club directory with team and game detail pages, AL/NL standings, season hitting and pitching leaders, and client-side favorites — all against statsapi.mlb.com.
The Results
Shipped a deployable MLB companion that demonstrates real API integration, typed data modeling, App Router conventions, and client interactivity (favorites, theme, live refresh) — a polished product UI rather than a template demo.
Technology Stack
My Role & Contributions
Sole builder — designed and shipped a multi-route Next.js product: landing hero, scores with date navigation, team directory and detail (roster, ballpark, club info), standings, season stats, individual game pages, and a contact UI. Built a typed client in lib/mlb/ for the MLB Stats API, App Router loading/error/not-found states, localStorage favorites, a theme toggle, and a branded responsive nav. Contact is a UI form; delivery is not wired yet.
Key Technical Decisions
- Typed MLB client — all statsapi.mlb.com calls go through a typed module in lib/mlb/ instead of ad-hoc fetch shapes in each page.
- App Router conventions — routes use loading, error, and not-found UI so slow or missing MLB data doesn’t blank the shell.
- Followed teams live in the browser — favorites persist in localStorage, no auth backend required for a portfolio companion.
- Soft auto-refresh — today’s scoreboard polls gently so live games stay current without hammering the API.
- Theme as a product feature — next-themes light/dark with a branded landing and favicon, not a default template toggle.
- Honest contact page — UI form is in place; message delivery is not wired yet, so the case study doesn’t overclaim.
Project Showcase
Take a closer look at the key features and interface design of the application.
Interested in Working Together?
Let's discuss how I can help bring your next project to life.
Get In Touch