Vercel for Vibe 102

What this is

This is the Vibe 102 checkpoint for making your mini app live on the internet.

Use the full Vercel reference if you need deeper explanation.

Why it matters

For Vibe 102, deployment is the share step after the app already works on localhost.

A public URL proves the mini app can run outside your laptop and can be submitted to the KrackedDevs showcase or project page.

What to do

Step 1 - Check GitHub first

Before opening Vercel, confirm:

My latest code is pushed to GitHub.
I can see project-brief.md in the GitHub repository.
I can see package.json in the GitHub repository.
Localhost worked before I pushed.
The app passed add, update, delete, refresh, and mobile-width checks.

If any of these are false, go back to GitHub Checkpoint.

Step 2 - Do these manually in the browser

These steps need you, not the AI agent:

1. Open vercel.com.
2. Log in with GitHub.
3. Click Add New or New Project.
4. Choose Import Git Repository.
5. Select the repository for this mini app.
6. If Vercel asks for GitHub access, approve access to this repository.
7. Keep the detected Vite framework settings.
8. Click Deploy.

Do not paste Vercel tokens, GitHub tokens, or private keys into AI chat.

Step 3 - Wait for the build

Vercel will install dependencies, build the project, and create a live URL.

If the build succeeds, open the live URL.

If the build fails, do not keep clicking deploy. Copy the build error and use the prompt below.

Step 4 - Test the live app

Open the live URL and check:

1. The app loads.
2. The design still matches project-brief.md.
3. Add works.
4. Update or mark works.
5. Delete works.
6. Refresh keeps saved items in this browser.
7. The app is readable on mobile width.
8. The live URL is the one you will share.

Use the finish rule:

If it is not live and checked, it is not ready to share.

If the Vercel build fails

Use this prompt:

My Vibe 102 Vercel deployment failed.

GitHub repository:
[paste repo link]

Build error:
[paste exact Vercel build error]

What worked before:
Localhost worked before I pushed.
The app could add, update, delete, and save with localStorage.

Help me identify the smallest fix.
Do not ask for tokens, passwords, private keys, or environment secrets.

After AI suggests a fix, make the fix locally, test localhost again, push to GitHub, and let Vercel redeploy.

Common mistakes

• Selecting the wrong GitHub repository.
• Deploying before GitHub has the latest code.
• Ignoring build errors and clicking deploy again.
• Changing framework settings without understanding why.
• Forgetting that localStorage data is browser-local, not shared between devices.
• Sharing the live URL before checking it yourself.