v0 by Vercel SEO

Your v0 App Is Invisible to Google

v0 by Vercel generates beautiful UI components and full pages from prompts. But when you deploy that code, it often ends up as a client-side rendered React app. Google visits your page, sees an empty HTML shell, and moves on. Your content never gets indexed.

What RndrKit Does

RndrKit renders your v0 app in a headless browser when search engine bots visit. Googlebot gets fully rendered HTML with all your content, meta tags, and images. Human visitors go straight to your app with no changes.

Before You Start: Do You Need RndrKit?

v0 generates code that you deploy to Vercel. How you deploy it determines whether you need pre-rendering:

  • Next.js with SSR/SSG -- If you are using getServerSideProps, getStaticProps, or the App Router with server components, your pages are already rendered on the server. You do not need RndrKit.
  • Client-side only -- If your v0 output is a Create React App, Vite app, or uses only client components, you do need RndrKit.

Not sure? Run this test:

curl -s "https://your-project.vercel.app/" | head -50

If you see your page content in the HTML, you are server-rendered and do not need RndrKit. If you see an empty shell with <div id="root"></div>, keep reading.

Setup

Step 1: Find Your Vercel App URL

After deploying your v0 code to Vercel, you get a default URL:

your-project.vercel.app

Find this in your Vercel dashboard under project settings. This is your origin URL.

Step 2: Remove Your Custom Domain from Vercel

Do this before changing DNS. If your custom domain is configured in Vercel, it will intercept traffic and RndrKit will not work.

  1. Go to your Vercel project settings.
  2. Navigate to Domains.
  3. Remove your custom domain (e.g., www.example.com).
  4. Keep the default *.vercel.app URL as your origin.

Step 3: Sign Up for RndrKit

Create your account at rndrkit.io.

Step 4: Add Your Domain

Click Add Domain in the dashboard:

FieldExampleDescription
Custom Domainwww.example.comThe domain your visitors will use
Origin URLyour-project.vercel.appYour Vercel app's default URL

Step 5: Configure DNS

Create a CNAME record at your DNS provider:

TypeNameValueTTL
CNAMEwwwcname.rndrkit.ioAuto

If you are using Cloudflare, set the proxy status to DNS only (gray cloud) during initial setup.

For detailed instructions, see DNS Configuration.

Step 6: Verify

Click Verify in the RndrKit dashboard, then test:

# Bot request -- should return fully rendered HTML
curl -s -A "Googlebot/2.1" "https://www.example.com/" | head -50

# Human request -- should return your SPA shell
curl -s "https://www.example.com/" | head -50

Platform-Specific Notes

v0 Generates Code, Not Hosting

v0 is a code generation tool -- it creates React components and pages. You still deploy the output to Vercel (or anywhere else). The setup with RndrKit is identical to the Vercel CSR guide because your app is hosted on Vercel.

Vercel Edge Functions

If your v0 project uses Vercel Edge Functions or middleware, those will continue to work on your *.vercel.app origin. RndrKit proxies human traffic to your origin unchanged.

Shadcn/ui Components

v0 commonly generates components using shadcn/ui. These render entirely in the browser. RndrKit handles them without any issues -- all interactive components will be fully rendered when served to bots.

SEO Quick Wins

Once RndrKit is active:

  • Add title tags to every page -- use react-helmet-async or Next.js <Head>
  • Write meta descriptions -- under 160 characters, summarizing the page
  • Include Open Graph tags -- for social media link previews
  • Set canonical URLs -- pointing to your custom domain, not vercel.app
  • Add structured data (JSON-LD) -- for rich search results

Verify It Works

curl -s -A "Googlebot/2.1" "https://www.example.com/" | head -100

You should see fully rendered HTML with your page content. If you see an empty shell, check the troubleshooting guide.

Next Steps

Previous

Replit

Next

Vercel (CSR)