Next.js Subscription Payments Starter

vercel/nextjs-subscription-payments ↗ ·★ 7.7k ·TypeScript ·MIT

Archived Next.js subscription starter with Stripe, Supabase and Vercel deploy, now superseded by the newer Next.js SaaS Starter.

Next.js Subscription Payments Starter screenshot
Stars
★ 7.7k
Language
TypeScript
License
MIT
Deploy targets
2

Overview

Next.js Subscription Payments Starter is Vercel’s older template for a subscription business built with Next.js, Stripe and Supabase. The repository README now warns that it has been sunset and replaced by nextjs/saas-starter, so treat this page as a reference for the Stripe/Supabase flow or for maintaining existing deployments rather than the first recommendation for new work.

The architecture splits responsibilities cleanly. Supabase owns identity and the database (with row-level security so users only see their own data), Stripe owns money, and the Next.js layer orchestrates between them. Stripe webhooks are the glue: when a subscription is created, upgraded or cancelled, a handler updates Supabase so your application logic can simply read the current plan from your own database.

Deployment is still well documented. The Vercel button clones the repo and provisions the Supabase integration during setup; from there you add your Stripe keys, define products and prices, and test checkout with the Stripe CLI. The important 2026 caveat is that Vercel points new projects to its successor starter, while this repository remains most useful for learning or for teams already built on it.

Highlights

  • Stripe Checkout and the Customer Portal wired up end to end
  • Supabase for auth, Postgres and row-level security
  • Webhooks keep subscription state in sync automatically
  • Archived by Vercel and replaced by the newer Next.js SaaS Starter

Best for

  • Studying a complete Stripe + Supabase subscription flow
  • Maintaining an existing app created from this template
  • Comparing the older template with Vercel's newer SaaS starter

Getting started

  1. 1 Review the README warning and consider the newer nextjs/saas-starter for greenfield work
  2. 2 Create products and prices in your Stripe dashboard (or use the included fixtures)
  3. 3 Add your Stripe secret key and webhook signing secret as environment variables
  4. 4 Run the Stripe CLI to forward webhooks locally, then test a checkout flow
#nextjs#saas#stripe#auth#starter

FAQ

What handles the database and auth?

Supabase. It provides Postgres, authentication and row-level security, while Stripe handles payments. The Next.js app ties them together.

Is the free tier enough to launch?

For experimentation or maintaining an existing project, yes — Vercel's Hobby tier hosts the frontend and Supabase's free tier covers auth and the database. For a new production SaaS, evaluate the replacement template first.

How do subscriptions stay in sync?

Stripe webhooks notify the app of new, updated and cancelled subscriptions, and the handler writes the current state into Supabase so your UI always reflects billing reality.

Deployment guides

Deploy Next.js Subscription Payments Starter for free

Free-tier platforms that can host this project. Pick one and ship it.