By Jake Mcdonald, founder of ShipEmber · Updated October 30, 2026 · About a 14-minute read
Adding Stripe subscriptions to a Next.js App Router app doesn't take much code. It goes wrong in the small details: a webhook that parses the body before verifying it, a handler that runs the same event twice, or a "Pro" check that only exists in a client component. This guide covers a complete Next.js Stripe subscription flow with stripe-node and Route Handlers, and keeps the parts that matter on the server.
Here's the plan:
A route that creates a Checkout Session in subscription mode.
A webhook route that reads the raw body, verifies the signature, and skips events it has already processed.
Syncing subscription state into your own database.
Gating a Pro page on the server, not in the browser.
The customer portal for upgrades, cancellations, and card changes.
Separate webhook secrets for local, test, and production (including Vercel).
The pitfalls that cost people an afternoon.
The examples assume…