A modern React app that curates daily NBA highlight videos

NBA Highlight Reel

The NBA Highlight Reel app is a lightweight, full-stack application designed to serve curated NBA highlights without the need for a backend database. Built entirely by a solo developer, the app showcases key skills in UI design, API integration, and problem-solving within a constrained technical scope.

Vist Site

The Challenge

Finding a lightweight way to serve curated NBA highlights was a technical challenge. As a solo developer, I wanted to avoid the complexity of standing up a full database-driven backend. The goal was to build an MVP that dynamically queried YouTube’s API and rendered relevant videos by date — all while keeping performance tight and mobile usability top of mind.

OUR SOLUTIONS

Leveraging Modern Full-Stack Tools

I built a fast, scalable MVP using React and Node.js, relying on the YouTube Data API to handle dynamic content fetching.

YouTube API Integration

Backend Proxy with Express

Date-Based Filtering

Client-Side App Using React + Vite

Dynamic Highlight Grid

Mobile-First UI with Custom CSS

The NBA Highlight Reel app served as a technical proof of concept and developer showcase

Proof of Full Stack Agility

Build and ship a full-stack app solo Integrate third-party APIs securely and effectively Prioritize UX and performance Solve real-world problems with pragmatic engineering decisions.

A curated, date-driven highlight browsing experience

What the App Includes

Custom React frontend using Vite API proxy via Node/Express for secure data fetching Integration with YouTube Data API Lightweight and database-free backend Responsive, user-first UI design.

Search by date functionality

The app features a clean date-based search tool that lets users instantly pull up NBA highlights from a specific day.

Embedded YouTube highlights

By leveraging the YouTube API, each video is embedded directly in the app — no redirects or janky players.

Fast load times via Vite build system

To keep the app lightweight and performant, I used Vite as the build tool.

From Idea to MVP Delivery

Project Timeline

What started as a simple “YouTube highlights viewer” evolved into a lightweight, full-stack app designed for performance, clarity, and mobile-first UX. From backend proxy setup to frontend UI polish, here’s how it all came together.

App Planning & Architecture

Mapped out the core functionality — search by date, fast rendering, and zero-database deployment. Decided on Vite + React for frontend performance and Express for secure API proxying. Prioritized simplicity and user-first interaction.

YouTube API Integration

Wrote backend logic in Node.js to securely fetch videos from the YouTube API. Implemented dynamic search by date and channel filtering to avoid hitting quota limits. This made the app scalable and API-key safe.

Search UI & Video Feed

Built a minimal UI where users can pick a date and instantly get relevant NBA highlights. Integrated YouTube’s embed player with graceful loading states and mobile responsiveness.

Proxy Server with Express

Created an Express server that acts as a backend proxy, shielding the API key and handling search queries server-side. Deployed it independently to Render for fast, isolated performance.

Why I Built the NBA Highlight Reel App

Creator’s Note

I built the NBA Highlight Reel app because I wanted to challenge myself to ship a full-stack project from start to finish — fast, functional, and without over-engineering. As a solo developer, I didn’t want to spin up a full backend just to serve video content. Instead, I focused on delivering something useful and performant: a date-based NBA highlights app powered by the YouTube API and a secure backend proxy. This app was my way of proving I could take an idea from zero to deployed product, solve real engineering problems, and create a clean, responsive UI along the way. It’s a true showcase of full-stack thinking, frontend finesse, and pragmatic problem-solving.

Caleb Matteis

Creator of the NBA Highlight Reel App

Need a Developer Who Builds, Not Just Executes?

Custom. Performant. Future-Ready.

Let’s Build Something Smart