tpl/02 · New

Your own paid
AI chat app,
already wired.

The VibeBoot AI Chatbot Starter: streaming chat, saved history, personas, Free vs Pro limits enforced on the server and Stripe subscriptions. Next.js 16, the Vercel AI SDK and any OpenAI-compatible model. Runs with zero API keys.

Get the starter · $59Try the live demo

14-day money-back guarantee · lifetime updates

Next.js 16.4.3 · public changelog

One-time · instant zip · new versions land in your Gumroad library · unlimited end products · demo uses Stripe test mode

  • 37

    Vitest tests

  • 0

    API keys to start

  • 4

    checks: types, lint, test, build

  • 390px

    mobile-first

$ git log v1.2.1..v1.2.2

What's new in v1.2.2 2026-10-28

  • ! Fixed: the pricing cards and the landing-page “messages a day” line were hardcoded. They now read getLimits(), so when you change the daily limits in your env, the copy matches what the server enforces.
  • + 37 passing Vitest tests.
v1.2.1 · 2026-10-23
  • + Upgraded Next.js to 16.4.3 (latest security patch release).
v1.2.0 · 2026-10-18
  • ! Fixed: a late-retried subscription.updated could flip a cancelled user back to Pro. The webhook now re-fetches the subscription from Stripe and writes its current state.
  • + Duplicate webhook deliveries are now harmless, with Vitest tests for duplicate, deleted-then-updated and stale-payload events.
v1.0.0 · 2026-10-16
  • + First release of the VibeBoot AI Chatbot Starter.

// 01  Screenshots

Not another gray chat box.

Real screenshots of the live demo, desktop and 390px. The theme is one block of CSS tokens, so it becomes your brand in minutes.

Desktop chat with history sidebar, usage meter and a TypeScript code block with a Copy code button
History, usage meter, code blocks with one-tap copy
Desktop chat streaming a reply with the neon streaming edge and a Stop button
Streaming: neon edge, caret, Stop
The included landing page with an animated waveform hero
The included landing page (yours to rebrand)
Chat streaming on a 390px phone screen
390px, streaming
Mobile history drawer with rename and delete
History drawer
Account page after upgrading to Pro through Stripe test checkout
Pro via Stripe webhook
Open the live demo, no signup

// 02  What you get

The chat UI and the business around it.

  • 01 · STREAM

    Streaming chat that feels fast

    Token-by-token replies with a neon streaming edge and caret. Stop, regenerate and retry. Partial replies are saved when you hit Stop.

  • 02 · MARKDOWN

    Markdown + code that copies clean

    GFM tables, lists and quotes. Fenced code blocks with a language label and one-tap copy. No raw HTML, so model output can't inject scripts.

  • 03 · HISTORY

    Conversations, saved per user

    History sidebar, inline rename, delete and auto titles. Every query is scoped to the signed-in user, so another user's chat is a 404.

  • 04 · MODELS

    Any model, switched by env

    Vercel AI SDK + any OpenAI-compatible API: OpenAI, OpenRouter, Groq, xAI, Together, Ollama, LM Studio. Route Pro users to a stronger model with one variable.

  • 05 · OFFLINE

    Runs with zero API keys

    A built-in mock provider streams realistic Markdown, so dev, demos and the test suite work offline and cost nothing.

  • 06 · PERSONAS

    Personas and system prompts

    Four personas out of the box (one Pro-only) in a single config file, plus a global system prompt via env.

  • 07 · LIMITS

    Free vs Pro limits on the server

    Messages per day, prompt length and context window per plan. Atomic quota so two tabs can't sneak past it. Token usage metered per user per day.

  • 08 · BILLING

    Stripe subscriptions

    Checkout, the Customer Portal and a signature-verified webhook that is the only thing allowed to change a user's plan.

  • 09 · SECURE

    Security you'd forget

    Auth.js v5 (GitHub + magic link), per-user chat rate limits, per-IP sign-in limits, CSP + HSTS headers and a launch checklist.

  • 10 · AGENTS

    Built for Cursor + Claude Code

    AGENTS.md, CLAUDE.md and three .cursor/rules files map every file and rule, so your agent extends it without breaking auth, limits or billing.

Setting your Free and Pro limits? Run the numbers in the free AI chat cost calculator →

// 03  Inside the zip

Your agent knows where everything lives.

Ask Cursor or Claude Code to “rebrand to Acme, accent #FF6B00, add a Pro ‘Lawyer’ persona”. AGENTS.md and the rules tell it which file to touch and which rules to keep: user-scoped queries, server-side limits, safe Markdown, webhook-only billing.

npm run check → typecheck · lint · 37 tests · build

src/
├─ app/api/chat/route.ts      ← auth → limits → stream → save
├─ lib/ai/provider.ts         ← env-switched models (AI SDK)
├─ lib/ai/mock.ts             ← offline provider
├─ config/personas.ts         ← system prompts, Pro-only flag
├─ lib/plans.ts · usage.ts    ← Free vs Pro, atomic quota
├─ lib/billing.ts             ← Stripe → DB (tested)
└─ components/chat/*          ← streaming UI, markdown, drawer
AGENTS.md · CLAUDE.md · .cursor/rules/*.mdc
tests/ (37) · docs/LAUNCH-CHECKLIST.md

Look inside the code

Real excerpts from the paid starter, trimmed with // ... marks.

src/app/api/chat/route.tslines 31–66, trimmed
export async function POST(req: Request) {  const session = await auth();  const userId = session?.user?.id;  if (!userId) return error(401, "unauthorized", "Sign in to chat.");  // ...  const user = await db.user.findUnique({ where: { id: userId }, select: { subscriptionStatus: true } });  const plan = planFor(user);  // ...  const persona = getPersona(convo?.persona ?? parsed.data.persona);  if (!canUsePersona(persona, plan)) return error(403, "pro_only", `${persona.name} is a Pro persona.`);   if (!regenerate) {    const input = checkInput(plan, content);    if (!input.ok) return error(input.status, input.code, input.message);  }   const quota = await reserveMessage(db, userId, plan);  if (!quota.ok) return error(quota.status, quota.code, quota.message);  // ...}
Every message passes auth, a Pro-persona check, an input limit and an atomic daily quota on the server.
src/app/api/stripe/webhook/route.tslines 7–24
export async function POST(req: Request) {  const secret = process.env.STRIPE_WEBHOOK_SECRET;  const signature = req.headers.get("stripe-signature");  if (!secret || !signature) {    return NextResponse.json({ error: "Missing webhook secret or signature" }, { status: 400 });  }   const stripe = getStripe();  let event: Stripe.Event;  try {    event = stripe.webhooks.constructEvent(await req.text(), signature, secret);  } catch {    return NextResponse.json({ error: "Invalid signature" }, { status: 400 });  }   await handleStripeEvent(event, { db, stripe });  return NextResponse.json({ received: true });}
Upgrades only happen through a Stripe webhook with a verified signature.

Auth and payments already work, try the live demo.

Get the starter · $59Try the live demo

14-day money-back guarantee · lifetime updates

// diy/cost  Build it yourself?

The chat box is the easy part. Here's the rest of the bill.

An agent can stream tokens into a textarea in ten minutes. Charging for it takes limits, billing and history that hold up. Every row below is already in the v1.2.2 zip. Untick what you have, set your hourly rate, and compare it with $59.

$ estimate --diy

Untick anything you already have. Hours assume you build it with Cursor or Claude Code, debugging included.

$10$150
Build it yourself
40h
≈ $1,600 of your time
Start from here
$59
Step-by-step README setup

That's 27× the price, and roughly 5 days you could spend on the part users actually pay for.

Skip the 40 hours · $59

14-day money-back guarantee · lifetime updates

Our estimates, not a promise. A senior dev who has shipped Stripe billing before will be faster; a first-timer fighting webhook retries at 1 AM will be slower.

// zip/facts  By the numbers

What's actually in the zip. Counted, not estimated.

Every number below comes from the v1.2.2 zip you download, and each one has a command you can run to check it.

  • 71

    files in the zip

  • 2,096

    lines of app code (44 files in src/)

  • 37

    passing tests in 7 files

  • 6 + 6

    pages + API routes

Routes

Pages

  • /
  • /pricing
  • /login
  • /settings
  • /chat
  • /chat/[id]

API routes

  • /api/chat
  • /api/auth/[...nextauth]
  • /api/stripe/checkout
  • /api/stripe/portal
  • /api/stripe/webhook
  • /api/dev/login

7 Prisma models: User, Conversation, Message, Usage, Account, Session, VerificationToken.

6 agent files: CLAUDE.md, AGENTS.md, .cursor/rules/project.mdc, .cursor/rules/ai.mdc, .cursor/rules/stripe.mdc, .cursor/rules/database.mdc.

19 variables documented in .env.example. No secrets, no node_modules in the zip.

Pinned versions (package-lock.json)

next
16.4.3
react
19.3.0
ai
7.0.142
next-auth
5.0.0-beta.32
prisma
6.19.3
stripe
23.0.0
zod
4.6.7
vitest
3.2.7

Small on purpose: you (and your agent) can read every file in an afternoon.

$ check it yourself after unzipping

  • find . -type f | wc -l71
  • cat $(find src -name '*.ts*' -o -name '*.css') | grep -c .2096
  • npm testTests 37 passed (37)

Run the first two before npm install. Counted 2026-10-31 from the v1.2.2 zip; tests run with Vitest on the same files.

Get the starter · $59

14-day money-back guarantee · lifetime updates

// 04  Honest comparison

vs Vercel Chatbot and ShipFast

Vercel's Chatbot is excellent and free. Use it if you want a reference app with file uploads and the AI Gateway. ShipFast is a broad SaaS boilerplate with email, a blog and a big community. This starter is for one job: charging money for an AI chat app.

 VibeBoot AI ChatbotVercel ChatbotShipFast
Price$59 one-timeFree, open sourceFrom $199 one-time
FocusPaid AI chat appAI chat app referenceGeneral SaaS boilerplate
Streaming chat UIYesYesNo chat UI
Saved chat historyYesYesNo
Stripe subscriptionsYes (Checkout, Portal, webhook)NoYes
Free vs Pro usage limitsYes, enforced on the serverNo paid plansNo
Landing + pricing pagesYes, brandedNoYes
Model providersAny OpenAI-compatible APIMultiple models via Vercel AI GatewayNot built in
Works offline (no keys)Yes, mock providerNon/a
File uploadsNoYes (Vercel Blob)No
Transactional email, blog, communityMagic-link only, noNoYes
Tests included37 (limits, authz, webhook)Not listed on template pageNot listed
Agent rules (AGENTS.md, .cursor/rules)YesNot listedSays it's built for AI editors

Checked October 16, 2026 on vercel.com/templates and shipfa.st. Prices and features change; check their sites.

Comparing more options? Read the AI chatbot template buyer's guide →

Not included (so you know before you buy)

  • File/image uploads (Vercel's free Chatbot has them) and tool calling
  • Teams/organizations, admin panel, i18n
  • Transactional email beyond magic-link sign-in
  • A shared rate-limit store: the limiter is in-memory per instance. Swap in Redis/Upstash for multi-instance hosts.

One-time · no subscription

$59USD

  • Streaming chat UI
  • History + personas
  • Free vs Pro limits
  • Stripe subscriptions
  • Any OpenAI-compatible model
  • Offline mock + 37 tests
  • Agent rules included
  • Unlimited end products
Get the starter · $59Live demo

14-day money-back guarantee · lifetime updates

Fair question

Won't AI-built code become unmaintainable?

It can. An agent with no structure to follow piles up duplicate helpers and unchecked routes. Architecture matters, so this starter ships the guardrails in the repo:

  • Written rules your agent reads first

    CLAUDE.md's 5 critical rules include “check the session server-side on every route and action” and “never trust plan or usage from the client”. AGENTS.md maps every key file, and 4 scoped .cursor/rules (project, ai, database, stripe) cover each area.

  • Reuse, not reinvent

    Conversation queries go through src/lib/conversations.ts, new model providers implement the ChatModel interface (“don't call provider SDKs from routes/components”), and limits change only in src/lib/plans.ts.

  • 37 tests that must pass

    Vitest covers chat authz (signed out, someone else's conversation, Pro personas), plan limits and quotas, provider selection and the offline mock, the Stripe webhook, rate limiting, security headers and the demo-login guard. npm run check runs typecheck, lint, tests and build.

  • Typed and predictable

    TypeScript strict, zod on the chat input, and a fixed order in the chat route (auth → rate limit → zod → ownership → persona gate → limits → stream). Agents must add or update a test when they touch limits, authz, billing or the chat route.

Guardrails don't replace review: you still read the diffs. They make the agent's default the project's way.

// 05  FAQ

Questions

What is the VibeBoot AI Chatbot Starter?

A Next.js 16 template for launching your own paid AI chat app: streaming chat, saved conversations, personas, Free vs Pro usage limits, Stripe subscriptions, Auth.js sign-in, a landing page and a pricing page. You bring the model and the brand.

How much does it cost?

$59, one-time. No subscription. Unlimited end products for you or your clients.

Do I get future updates?

Lifetime updates included: every new version goes to your Gumroad library at no extra cost (one-time payment, no subscription).

Can I get a refund?

Yes. Every purchase has a 14-day money-back guarantee, no questions asked. Email [email protected] (or reply to your Gumroad receipt) within 14 days and you get a full refund through Gumroad. Details are in the terms at vibeboot.dev/terms.

Which AI models does it support?

Any OpenAI-compatible API through the Vercel AI SDK: OpenAI, OpenRouter, Groq, xAI, Together, Fireworks, DeepSeek, Mistral, or local models via Ollama and LM Studio. Set AI_BASE_URL, AI_API_KEY and AI_MODEL. Optionally route Pro users to a different model.

Do I need an API key to try it?

No. With no key it uses a built-in offline mock provider that streams realistic Markdown, so it runs, demos and passes its tests for free.

How are Free and Pro limits enforced?

On the server, in the chat API, before the model is called: messages per day, max prompt length and context size per plan, with an atomic quota so parallel requests can't exceed it. The plan comes only from your database, which only the verified Stripe webhook updates.

Won't AI-built code become unmaintainable?

It can, if the agent has nothing to follow, so the guardrails ship in the repo. CLAUDE.md starts with 5 critical rules (check the session server-side on every route and action, scope every conversation query by the session user id, run npm run check before you're done). AGENTS.md maps every key file and tells the agent to reuse what exists: conversation queries go through src/lib/conversations.ts, new providers implement the ChatModel interface, limits change only in src/lib/plans.ts. It's TypeScript strict with zod validation, and 37 Vitest tests cover chat authz, plan limits, the provider, the Stripe webhook, rate limiting and security headers. You still review the diffs, but the agent's default becomes the project's way.

Does it work with Cursor and Claude Code?

Yes, that's who it's built for. AGENTS.md, CLAUDE.md and .cursor/rules map every file and the rules your agent must keep (user-scoped queries, server-side limits, safe Markdown). It's also a normal Next.js project you can edit by hand.

Where can I deploy it?

Any Node host: Vercel, Railway, Fly, Render or Docker. Use Postgres in production (change the provider in prisma/schema.prisma and set DATABASE_URL). The live demo runs on Cloudflare Workers with D1.

How is it different from Vercel's free Chatbot template?

Vercel's template is a great free reference with file uploads and many models via its AI Gateway, but it has no billing, usage limits, landing or pricing page. This starter is the business layer: Stripe subscriptions, Free vs Pro limits, metering and marketing pages, plus an offline mode and tests.

What's not included?

File uploads, tool calling, teams/organizations, an admin panel, i18n and transactional email beyond magic links.

What license do I get?

A single-buyer license: build unlimited personal or client end products, commercial use allowed. You may not resell or redistribute the template itself. Private repos are fine.

$ not buying today?

Get the next template and the build guides by email.

New VibeBoot starters, Cursor + Claude Code workflows, Stripe and Next.js how-tos. Free, occasional, unsubscribe in one click.

Subscribe free

Ship the chat app this weekend.

One download. Unlimited projects. $59 one-time.

Get the starter · $59Try the live demo

14-day money-back guarantee · lifetime updates