Draft Gurus: Predict the Pick

A real-time NFL Draft prediction game for the 2026 first round. Predict all 32 picks, compete with friends, and watch scores update live as the draft unfolds.

How It Works

1. Before the draft -- Visit /predict, fill in all 32 first-round picks from the prospect pool, enter your name, and submit.
2. Draft night -- Predictions lock at 8:00 PM ET on April 23. An admin enters actual picks via /admin as they're announced.
3. Scoring -- Points are based on how close each player is to the pick number you predicted. Teams don't matter (trades shuffle the order).

Result	Points
Exact pick (right player, right slot)	10
Within 1 pick	7
Within 2-3 picks	5
4+ picks away but still in Round 1	3
Player not drafted in Round 1	0

Max score: 320 pts (32 x 10). Tiebreaker: earliest submission.

Setup

1. Create a Supabase project

1. Go to supabase.com and create a free account/project.
2. In the Supabase dashboard, go to SQL Editor and paste the contents of supabase-migration.sql. Click Run.
3. Go to Settings > API and copy your Project URL and anon/public key.

2. Configure environment variables

cp .env.local.example .env.local

Edit .env.local with your Supabase credentials:

NEXT_PUBLIC_SUPABASE_URL=https://your-project.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key-here
ADMIN_SECRET=your-secret-password

3. Run locally

npm install
npm run dev

Open http://localhost:3000.

4. Deploy to Vercel

1. Push this repo to GitHub.
2. Go to vercel.com, import the repo.
3. Add the three environment variables from .env.local in the Vercel dashboard.
4. Deploy. Done.

Pages

Route	Description
/	Landing page with countdown, rules, and navigation
/predict	Make your 32 first-round picks (locked at draft start)
/leaderboard	View rankings, scores, and per-pick breakdowns
/admin	Enter actual draft results (password-protected)

Admin Usage

During the draft, go to /admin, enter your ADMIN_SECRET, and select the actual player drafted at each pick. Scores on the leaderboard update automatically (the leaderboard polls every 15 seconds).

Tech Stack

• Next.js 14 (App Router)
• Supabase (Postgres + Realtime)
• Tailwind CSS
• Vercel (deployment)