---
title: "Deploy Saturday"
description: "Deploy the Saturday starter to your own Vercel account with one click, then confirm it's live. This is the deployment that every other lesson in the course configures."
canonical_url: "https://vercel.com/academy/optimize-your-vercel-account/deploy-saturday"
md_url: "https://vercel.com/academy/optimize-your-vercel-account/deploy-saturday.md"
docset_id: "vercel-academy"
doc_version: "1.0"
last_updated: "2026-07-21T19:54:06.578Z"
content_type: "lesson"
course: "optimize-your-vercel-account"
course_title: "Optimize Your Vercel Account"
prerequisites:  []
---

<agent-instructions>
Vercel Academy — structured learning, not reference docs.
Lessons are sequenced.
Adapt commands to the human's actual environment (OS, package manager, shell, editor) — detect from project context or ask, don't assume.
The lesson shows one path; if the human's project diverges, adapt concepts to their setup.
Preserve the learning goal over literal steps.
Quizzes are pedagogical — engage, don't spoil.
Quiz answers are included for your reference.
</agent-instructions>

# Deploy Saturday

# Deploy Saturday

Clicking Deploy is the starting line for this course. Every setting we'll touch only matters because something is running. So before we configure the firewall, audit the env vars, or argue with Bot Protection about who counts as a real visitor, we need something live.

That's Saturday. A small public site for a fictional indie sneaker label. Five styles, a drop schedule, a stock-check API, a webhook that flips a drop from coming-soon to live. The features were chosen on purpose. Each one gives us something to configure in a later lesson.

Let's get it deployed.

\*\*Note: What is a Vercel project?\*\*

A project is the unit Vercel organizes everything around. It connects a Git
repository to its deployments, domains, environment variables, and settings.
Everything this course configures hangs off the one project you're about to
create.

## Outcome

Saturday is running at a Vercel-hosted URL on your own account, with its `DROP_WEBHOOK_SECRET` environment variable set.

## Hands-on exercise 1.1

Get Saturday live on your Vercel account. The starter has everything you need: five product pages, a drop schedule, two API routes, real product photos. You don't have to write any code yet.

**Requirements:**

1. Deploy Saturday with the **Deploy with Vercel** button above
2. Set the `DROP_WEBHOOK_SECRET` environment variable when the deploy flow prompts for it, before the first deploy
3. Visit the live URL and confirm the homepage loads with the next drop and the product grid

**Implementation hints:**

- The button forks `vercel-labs/academy-optimize-vercel-account` into your own GitHub and connects it to a new Vercel project. Nothing to clone by hand to get it live.
- For `DROP_WEBHOOK_SECRET`, generate something long and random. `openssl rand -hex 32` works. Don't reuse the example value from `.env.example`.
- Prefer to wire it up yourself? Clone the starter, push it to a new repo on your own account, then import it at `vercel.com/new`. The button just collapses those steps into one.
- Use a brand-new Vercel team if you want a clean slate for the course. Or use your existing one and just create a new project. Either is fine.
- Don't worry about marking the env var as sensitive yet. We do that in Lesson 2.1, on purpose.

## Try It

After the deploy finishes, open the URL Vercel hands you. You should see something like this:

```
SATURDAY
INDEPENDENT FOOTWEAR / EST. 2026

Shoes for the part of the week that isn't a meeting.

Five styles. One drop at a time. Made in small batches and shipped from a single warehouse in Portland.

NEXT DROP
Off-Hours / Twilight
Saturday, June 7 / $175
[ VIEW DETAILS ]
```

Click into a product page. You should see the hero image, size grid, and a Check Stock button. The button doesn't do anything visible yet, but the endpoint behind it is wired up. We'll see it work in Lesson 3.2.

Now visit `/drops`. You should see the full schedule of five upcoming drops, sorted by date. This page is the one we'll move from interval revalidation to on-demand revalidation in Lesson 3.3.

If you see all three of those things, the deploy worked.

## Done-When

- [ ] Saturday is deployed to a Vercel-hosted URL on your team
- [ ] `DROP_WEBHOOK_SECRET` is set as an environment variable in Vercel
- [ ] The homepage loads with the next drop teaser and product grid
- [ ] `/drops` and at least one `/products/[slug]` page render correctly
- [ ] You can find this new project in your Vercel dashboard

## Troubleshooting

**The deploy failed with a missing dependency error.**

The starter declares pnpm in its lockfile. Vercel auto-detects pnpm in most cases, but if your team is set to npm by default, set the install command to `pnpm install` and the build command to `pnpm build` in Project Settings > Build and Deployment.

**The product images don't load.**

Check that the `public/products/` directory made it into your new repo. The product data references `/products/foundry.jpg`, `/products/crosswalk.jpg`, etc. If those files are missing from `public/`, Next.js renders broken image placeholders. Re-copy the images and push again.

## Solution

The starter is the solution. There's no code to write in this lesson; the only thing you're producing is a deployed URL.

The button deployed the `main` branch, which is the starter. The same repo has a `complete` branch with every code change this course makes already applied. You don't need it to follow along, but if a later lesson's code misbehaves, compare your file against the same file on `complete`. Running `git diff main complete` shows the full set of changes at once.

Once it's live, take a screenshot of the Vercel project's overview page. You'll see the deployment URL, the GitHub repo it's connected to, the production branch, and the framework Vercel detected. That overview is the page we'll return to every time we add a configuration in a later section.

We have something live. Next we'll find out where every setting we're about to touch actually lives in the dashboard.


---

[Full course index](/academy/llms.txt) · [Sitemap](/academy/sitemap.md)
