TL;DR: You can build a complete SaaS app with AI in a weekend — authentication, database, dashboard, core features, and Stripe payments. The stack: Next.js + TypeScript + Supabase + Stripe. This guide walks through each phase with the actual prompts to use. The code is the easy part — the hard part is deciding what to build and making it feel polished.
The AI-Friendly SaaS Stack
Before writing a single prompt, choose your stack. AI generates dramatically better code for some combinations than others. Here's what works best in 2026:
| Layer | Recommended | Why | Alternatives |
|---|---|---|---|
| Framework | Next.js | Deepest AI training data, full-stack | Remix, SvelteKit |
| Language | TypeScript | AI catches more errors, better code gen | JavaScript (works, less safe) |
| Styling | Tailwind CSS | AI generates clean Tailwind consistently | CSS Modules, styled-components |
| Database | Supabase | PostgreSQL + auth + storage, free tier | PlanetScale, Neon, Railway |
| ORM | Prisma | Type-safe, AI knows it well | Drizzle (lighter) |
| Auth | Better Auth / Clerk | Drop-in auth, social logins | NextAuth, Supabase Auth |
| Payments | Stripe | Industry standard, best docs | Lemon Squeezy (simpler) |
| Hosting | Vercel | Zero-config Next.js deploys | Railway, Fly.io |
This isn't about what's "best" in absolute terms. It's about what AI generates the best code for. Claude and GPT have seen millions of Next.js + Prisma + Tailwind codebases. When you prompt for features using this stack, you get working code on the first try more often than with any other combination.
Phase 1: Foundation (Day 1 Morning)
Start with the skeleton. Here's the prompt to kick things off:
"Create a Next.js 14 app with TypeScript, Tailwind CSS, and the App Router. Set up the project structure with: a landing page at /, a dashboard at /dashboard (protected), a pricing page at /pricing, and an auth flow at /login and /signup. Use a clean, modern design with a dark sidebar layout for the dashboard. Include a responsive navbar for the public pages."
AI will generate your project structure. Before moving on, verify:
- ✅
npm run devworks without errors - ✅ Landing page renders at
localhost:3000 - ✅ Dashboard has a sidebar layout
- ✅ Navigation works between pages
Add the Database
"Add Prisma with a PostgreSQL connection to Supabase. Create a schema with: User (id, email, name, plan, createdAt), Subscription (id, userId, stripeCustomerId, stripePriceId, status, currentPeriodEnd), and [YOUR CORE ENTITY] (id, userId, title, content, createdAt, updatedAt). Run the initial migration."
Replace [YOUR CORE ENTITY] with whatever your SaaS is about — Projects, Documents, Campaigns, Reports, whatever. This is your core data model.
Phase 2: Authentication (Day 1 Afternoon)
Authentication is the first real feature. Don't build it from scratch — use a library.
"Add Better Auth to the project. Set up email/password authentication and Google OAuth. Create a middleware that protects /dashboard/* routes — redirect to /login if not authenticated. Add a user menu in the dashboard header showing the user's name and a sign-out button. Store the session in a secure HTTP-only cookie."
After AI generates this, test the full flow:
- Sign up with email → should redirect to dashboard
- Sign out → should redirect to landing page
- Visit /dashboard directly → should redirect to /login
- Sign in with Google → should work and show your name
Client-side only protection. AI often protects routes only in the browser (checking auth state in React). A savvy user can bypass this. Always verify auth server-side in your API routes and middleware too. Ask AI: "Is this auth check happening server-side or client-side? I need both."
Phase 3: Core Feature (Day 2 Morning)
This is the thing your SaaS actually does. The prompt depends entirely on your product, but the pattern is the same:
"Build the core [FEATURE] functionality. Users should be able to: create a new [entity], list all their [entities] in the dashboard, edit an existing [entity], delete an [entity] with a confirmation modal. Use server actions for the mutations and show loading states. Include empty states ('No [entities] yet — create your first one')."
This is your CRUD layer — the backbone of most SaaS apps. AI handles this extremely well because it's the most common pattern in web development. Focus your energy on making it feel good: transitions, loading states, error messages, empty states.
The Dashboard Experience
Your dashboard is where users spend 90% of their time. It needs to feel snappy and intuitive. Key elements:
- Sidebar navigation — consistent across all dashboard pages
- Quick stats — show the user their key metrics at a glance
- Recent activity — what happened last
- Primary action button — "Create New [Entity]" always visible
- Search and filter — once users have more than 10 items
Phase 4: Payments (Day 2 Afternoon)
This is where your SaaS becomes a business. Stripe handles the hard parts — you just need to connect the pieces.
"Add Stripe subscription payments. Create three plans: Free (limited to 5 [entities]), Pro ($19/month, unlimited [entities] + [premium feature]), and Team ($49/month, everything in Pro + team members). Set up: a pricing page with plan comparison, Stripe Checkout for subscription creation, webhook handler for subscription events (created, updated, cancelled, payment failed), and a billing page in the dashboard showing current plan, next payment date, and a button to manage subscription via Stripe Customer Portal."
Critical: test the entire payment flow.
- User clicks "Subscribe to Pro" → Stripe Checkout opens
- Use test card
4242 4242 4242 4242→ payment succeeds - Webhook fires → your database updates the user's plan
- User returns to dashboard → sees "Pro" badge, feature unlocked
- User cancels → subscription ends at period end, not immediately
- Skipping webhook signature verification — anyone could fake a payment event. Always verify with
stripe.webhooks.constructEvent() - Granting access on checkout success redirect — don't trust the redirect URL. Wait for the webhook to confirm payment actually succeeded.
- Forgetting test mode vs live mode — AI often hardcodes test API keys. Use environment variables and never commit Stripe keys to git.
- No handling for failed payments — subscriptions can fail on renewal. You need a "past due" state and a way to prompt the user to update their payment method.
Phase 5: Polish & Launch (Day 3)
The difference between a prototype and a product is polish. This is the hardest phase because AI handles it worst — these are the judgment calls that require understanding your users.
The Polish Checklist
| Category | What to Check | Priority |
|---|---|---|
| Error States | What happens when API fails? Show friendly errors, not stack traces | 🔴 Critical |
| Loading States | Every button click, page load, and form submit needs a loading indicator | 🔴 Critical |
| Mobile | Test every page on phone. Sidebar should collapse. Forms should be usable | 🔴 Critical |
| Empty States | "No results" pages should guide users to take action | 🟡 Important |
| Welcome email, payment confirmation, password reset | 🟡 Important | |
| SEO | Landing page meta tags, OG images, sitemap | 🟡 Important |
| Error Monitoring | Add Sentry so you know when things break in production | 🟡 Important |
| Rate Limiting | Protect auth and API endpoints from abuse | 🟡 Important |
| Analytics | Plausible or PostHog so you know what users actually do | 🟢 Nice to have |
| Dark Mode | Users expect it. Tailwind makes it easy | 🟢 Nice to have |
Deploy
With Vercel, deployment is one command:
# Connect your GitHub repo to Vercel
# Push to main = automatic deploy
git push origin main
Set your environment variables in the Vercel dashboard: database URL, Stripe keys, auth secrets. Done. Your SaaS is live.
What It Costs to Run
| Service | Free Tier | At Scale (~1,000 users) |
|---|---|---|
| Vercel | 100GB bandwidth, 100hrs serverless | $20/month Pro |
| Supabase | 500MB database, 50K auth users | $25/month Pro |
| Stripe | No monthly fee | 2.9% + 30¢ per transaction |
| Domain | — | $12/year |
| Email (Resend) | 3,000 emails/month | $20/month |
| Monitoring (Sentry) | 5K errors/month | Free tier usually enough |
| Total | $0-65/month + Stripe fees | |
At $19/month per user, you need 4 paying customers to cover all infrastructure costs. Everything after that is profit.
SaaS Patterns AI Handles Well
Once your foundation is solid, these features are straightforward to add with AI:
- Team/workspace features — invite team members, role-based access (admin/member/viewer)
- Usage limits by plan — track usage in the database, check against plan limits
- API key generation — let users create API keys for programmatic access
- Audit logs — track who did what, when (important for B2B)
- Export data — CSV/JSON export of user data
- Onboarding flow — step-by-step setup wizard for new users
- Background processing — for slow tasks (AI generation, report building, email sends)
Frequently Asked Questions
Yes. 25% of YC W2025 had 95%+ AI-generated codebases and raised millions. AI handles the code — you handle product decisions and business logic. The technical barrier to SaaS has dropped dramatically.
A basic SaaS (auth + dashboard + core feature + payments) in a weekend. Production-ready with polish takes 2-4 weeks. AI gets you to 80% fast — the last 20% (edge cases, UX polish, error states) takes the most time.
Next.js + TypeScript + Tailwind + Supabase + Stripe + Better Auth/Clerk. This stack has the deepest AI training data — Claude and GPT generate better code for this combination than any other in 2026.
$0-65/month on free tiers + Stripe transaction fees. At $19/month pricing, 4 paying customers covers all infrastructure. Many profitable solo SaaS products run on under $100/month.
Not the code — the product decisions. What feature is worth paying for? How do you price it? AI can generate any feature but can't tell you which features matter to customers. Second hardest: the "last mile" polish that makes a prototype feel like a product.