Tech stack for a vibe-coded MVP (2026)
Link-in-bio builder made with Claude Code, designed by StackPrism from one sentence: 7 components, a reason for each, and the live checks that watch them.
The stack
Next.js
Clerk
Supabase
Stripe
Sentry
“An MVP I’m building with Claude Code: a link-in-bio page builder. Creators sign up, customise a public page with their links and a profile photo, and pay for a pro plan with custom domains. I want the stack coding agents know best and the fewest moving parts.”
Their answers on the constraints step
- Budget
- Free until it has users
- Time to launch
- Days
- What they know
- TypeScript
- DevOps
- No DevOps experience
Make it yours. Open this stack in the editor to check its health, harden it and hand it to your coding agent. No sign-up, nothing to generate.
Start from this stackSelect a component to see what it does and what it connects to, or pick one above to see what breaks if it goes down. Pinch or use the buttons to zoom.
Why this stack
Everything is TypeScript in one Next.js project on Vercel: the pages and dashboard, plus route handlers for the server work, so a coding agent has one codebase to change. Clerk handles sign-up and sessions, Supabase Postgres keeps creators and their links, and Supabase Storage holds profile photos. Stripe runs the pro plan and tells the route handlers about payments through webhooks, and Sentry reports errors. Every piece is a managed service, which fits the answers: launch in days, with no DevOps.
Why each piece
All 7 components on the diagram: what each one does, what it talks to, and what stops if it goes down.
Next.js Route Handlers
Runs on Vercel
Server actions. Calls Supabase Postgres (reads/writes), Supabase Storage (uploads) and Stripe (billing). Called by Stripe (webhooks).
Nothing else on the diagram depends on it.
Next.js App
Runs on Vercel
Dashboard and pages. Calls Clerk (auth) and Sentry (errors).
Nothing else on the diagram depends on it.
Clerk
Auth and sessions. Called by Next.js App (auth).
If it goes down, 1 of 6 components stops working.
Supabase Postgres
In Data & Storage
Creator data. Called by Next.js Route Handlers (reads/writes).
If it goes down, 1 of 6 components stops working.
Supabase Storage
In Data & Storage
Profile images. Called by Next.js Route Handlers (uploads).
If it goes down, 1 of 6 components degrades.
Stripe
In External Services
Subscriptions. Calls Next.js Route Handlers (webhooks). Called by Next.js Route Handlers (billing).
If it goes down, 1 of 6 components degrades.
Sentry
In External Services
Error tracking. Called by Next.js App (errors).
If it goes down, 1 of 6 components degrades.
When this stack fits
- You build with Claude Code, Cursor or Codex and want one TypeScript codebase to point it at.
- The product is pages, a dashboard, accounts and one paid plan.
- You want to ship in days on managed services, with nothing to patch or scale yourself.
When to pick something else
- The app needs scheduled or slow work, like imports or emails on a timer: add a job runner such as Inngest, as in the micro-SaaS example.
- You’d rather keep sign-in next to your data: Supabase Auth can replace Clerk and removes one vendor.
- Custom domains for every creator need extra work on the hosting side, which this diagram doesn’t show.
What you need to build this
7 components across 6 areas of the stack.
Build it with your AI agent
Hand the stack to Claude Code, Codex, Cursor or any coding agent as a brief: how it connects, install steps and a build plan.
Frontend2
Data1
- Docs
Supabase Postgres
Creator data
npm install @supabase/supabase-js
Auth1
- Docs
Clerk
Auth and sessions
npm install @clerk/nextjs
Payments1
- Docs
Stripe
Subscriptions
npm install stripe
Storage & CDN1
- Docs
Supabase Storage
Profile images
npm install @supabase/supabase-js
Observability1
- Docs
Sentry
Error tracking
npm install @sentry/nextjs
Install
npm install next @supabase/supabase-js @clerk/nextjs stripe @sentry/nextjs
SDKs only. Pick your own database driver or ORM.