a vibe coding manifesto

Start with v0

The fastest way to go from idea to a real codebase you can hack on with any AI tool. It's all about the boilerplate.

The Thesis

You want to start vibe coding. Maybe you've heard about Claude Code, Cursor, Windsurf, or some other AI-powered dev tool. You're ready to dive in.

But here's the thing — those tools work best when they have something to work with. A real codebase. A real project structure. A real repo on GitHub.

That's where v0 comes in.

“Stand up your boilerplate in v0, push it to GitHub, pull it down locally, and chip away with whatever AI tool you want.”

The Flow

Four steps to vibe coding nirvana

01

Prompt v0

Tell v0 what you need in plain language. It generates a full Next.js app with shadcn/ui, Tailwind, TypeScript, and proper project structure. Not a toy — real, production-grade boilerplate.

> "Build me a dashboard with auth,
   a sidebar, and a settings page"

  v0 generates:
  ├── app/
  │   ├── layout.tsx
  │   ├── page.tsx
  │   ├── dashboard/
  │   └── settings/
  ├── components/ui/
  ├── lib/
  └── package.json
02

Push to GitHub

v0 connects directly to GitHub. Your generated app becomes a proper repo with a single click. No copy-pasting, no manual git init, no fighting with project scaffolding.

$ git remote -v
  origin  git@github.com:you/my-app.git

  $ git log --oneline
  a1b2c3d  Initial commit from v0

  Your app is now a real repo.
  Ready for collaboration.
  Ready for CI/CD.
03

Pull Locally

Now you have a real codebase on your machine. Open it in VS Code, Cursor, or whatever you prefer. The project structure is clean, the dependencies are installed, and everything just works.

$ git clone git@github.com:you/my-app.git
  $ cd my-app
  $ npm install
  $ npm run dev

  ✓ Ready in 1.2s
  ➞ Local: http://localhost:3000
04

Build with Any AI

This is where it clicks. Claude Code, Cursor, Copilot — they all work dramatically better when they have real project context. You're not starting from scratch. You're iterating on a solid foundation.

$ claude

  > "Add Stripe to the settings page
     for subscription management"

  Claude sees your project structure,
  understands your patterns, and writes
  code that actually fits.

  Context is everything.
The Comparison

Skip the setup ceremony

Start with v0

  • Real Next.js app with proper structure
  • shadcn/ui + Tailwind pre-configured
  • Push to GitHub in one click
  • Pull locally and use any AI tool
  • AI SDK + chatbot wiring built-in
  • Deploy to Vercel instantly

Start from scratch

  • npx create-next-app, then configure everything
  • Install and set up component libraries manually
  • git init, git remote add, first commit...
  • Still just a blank starter template
  • Wire up AI SDK, API routes, streaming yourself
  • Configure deployment from scratch
Bonus

v0 is really good at wiring up chatbots

Need an AI-powered feature in your app? v0 can scaffold a fully wired chatbot using the Vercel AI SDK and the AI Gateway — connected to any LLM you want — in a single prompt.

AI SDK 6

Streaming responses, tool calling, structured outputs — all wired up with best practices out of the box.

Vercel AI Gateway

Zero-config access to OpenAI, Anthropic, Google, and more. Swap models with a single line change.

Agent-Ready

Model selector, temperature controls, system prompts, and tool configuration from the start.

> "Add a chatbot to my app using GPT-4o
   with a settings panel for model selection"

  v0 generates:
  ├── app/api/chat/route.ts     ← AI SDK streaming
  ├── components/chat.tsx        ← Chat UI
  ├── components/chat-settings.tsx
  └── Ready to deploy. No API keys to juggle.
TL;DR

v0 is your on-ramp to vibe coding

Generate the boilerplate. Push to GitHub. Pull locally. Build with whatever AI tool speaks to you. The best code comes from starting with a real foundation.

Start with v0