AIRecipes
🧑‍💻Vibe Coding

Set up your vibe coding environment

Go from zero to a live, auto-deploying app: install Claude Code, connect GitHub, add a Supabase database, and deploy with Vercel.

Beginner 30 min $0

Last updated Jul 29, 2026

XFacebookLinkedIn

★ Recommended workflow

Install → Connect → Database → Deploy

Claude Code becomes your AI pair programmer in the terminal, GitHub tracks every change, Supabase gives you a live database, and Vercel auto-deploys on every push.

30 min$0
  1. 1
    Claude Code

    Input: A terminal and an empty project folder → Output: Claude Code installed and running inside your project

    Install Claude Code

    npm install -g @anthropic-ai/claude-code cd your-project-folder claude Then just describe what you want to build in plain language — no need to open a separate editor.

  2. 2
    GitHubFree option

    Input: Your local project folder → Output: Your code versioned and backed up on GitHub

    Initialize git and push to GitHub

    git init git add . git commit -m "Initial commit" gh repo create my-project --public --source=. --push (Or create the repo on github.com first, then `git remote add origin <url>` and `git push -u origin main`.)

  3. 3
    SupabaseFree option

    Input: Your app's data needs (auth, database, storage) → Output: A live Postgres database and connection string

    Create a Supabase project

    Go to supabase.com → New Project → pick a name and region. Copy the Project URL and anon/service keys into your project's .env file, then ask Claude Code to "connect this project to my Supabase database."

  4. 4
    VercelFree option

    Input: Your GitHub repository → Output: A live, auto-deploying production URL

    Deploy with Vercel

    Go to vercel.com/new → Import your GitHub repository → add your Supabase env vars → Deploy. Every future `git push` to main redeploys automatically.

FAQ

Do I need to know how to code to start?

Basic familiarity helps for reviewing what Claude Code changes, but you can describe features in plain language and let it write the code.

What if I get stuck installing something?

Paste the exact error message back into Claude Code — it can usually diagnose and fix installation issues on its own.