> For the complete documentation index, see [llms.txt](https://developer.paddle.com/llms.txt).

# Next.js starter kit

Production-ready Next.js SaaS starter kit with Paddle Billing, Supabase auth, and Vercel deployment. Includes a localized pricing page, integrated checkout, and customer subscription management screens.

---

A complete Next.js app integrated with Paddle Billing. Drop-in pricing page, inline checkout, customer-facing subscription management, and webhook syncing — ready to deploy to Vercel.

{% card-group cols=3 %}
{% card title="GitHub" icon="carbon:logo-github" url="https://github.com/PaddleHQ/paddle-nextjs-starter-kit" %}
View source code, report issues, and contribute on GitHub.
{% /card %}
{% card title="Live demo" icon="carbon:application-web" url="https://paddle-billing.vercel.app/" %}
Try the starter kit before you get started.
{% /card %}
{% card title="Tutorial" icon="carbon:rocket" url="/get-started/starter-kits/nextjs-saas" %}
Step-by-step walkthrough from setup to test payment.
{% /card %}
{% /card-group %}

## What's included

- A three-tier pricing page, fully localized for 200+ markets.
- A high-converting inline checkout built with [Paddle Checkout](https://developer.paddle.com/concepts/sell/self-serve-checkout.md).
- User management and authentication via [Supabase](https://supabase.com/).
- Customer-facing screens to manage subscriptions and payments.
- Automatic syncing of customer and subscription data between Paddle and your app [using webhooks](https://developer.paddle.com/webhooks/overview.md).

## Tech stack

| Layer        | Tool                                                                                  |
| ------------ | ------------------------------------------------------------------------------------- |
| Framework    | [Next.js](https://nextjs.org/)                                                        |
| Hosting      | [Vercel](https://vercel.com/)                                                         |
| Auth + DB    | [Supabase](https://supabase.com/)                                                     |
| Payments     | [Paddle Node.js SDK](https://developer.paddle.com/sdks/libraries/node.md) + [Paddle.js wrapper](https://developer.paddle.com/sdks/libraries/paddle-js-wrapper.md) |
| Styling      | [Tailwind CSS](https://tailwindcss.com/)                                              |
| Components   | [shadcn/ui](https://ui.shadcn.com/)                                                   |

## Requirements

- A [Vercel](https://vercel.com/) account.
- A [Supabase](https://supabase.com/) account.
- A Git provider (GitHub recommended).
- Node.js v20+ if you plan to develop locally.

## Get started

Deploy the starter kit to Vercel:

[Deploy Paddle Next.js SaaS starter kit to Vercel in one-click](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2FPaddleHQ%2Fpaddle-nextjs-starter-kit&env=PADDLE_API_KEY,PADDLE_NOTIFICATION_WEBHOOK_SECRET,NEXT_PUBLIC_PADDLE_ENV,NEXT_PUBLIC_PADDLE_CLIENT_TOKEN&integration-ids=oac_VqOgBHqhEoFTPzGkPd7L0iH6&external-id=https%3A%2F%2Fgithub.com%2FPaddleHQ%2Fpaddle-nextjs-starter-kit%2Ftree%2Fmain)

Alternatively, follow [the complete tutorial](https://developer.paddle.com/get-started/starter-kits/nextjs-saas.md) to deploy the starter kit manually.