The Creem Next.js Template is open source and available on GitHub. Use it for examples on how to integrate Creem with your Next.js App Router.

​
Overview

Modern Stack

Next.js App Router, Prisma ORM, Shadcn UI, Radix UI, and Tailwind CSS.

Creem Integration

End-to-end subscription and payment flows powered by the Creem SDK.

​
Quickstart

1. Clone the repository

git clone https://github.com/armitage-labs/creem-template.git
cd creem-template

2. Install dependencies

yarn install
# or
npm install
# or
pnpm install

3. Set up environment variables

cp .env.example .env
# Edit .env and fill in the required variables

4. Run database migrations

yarn prisma migrate dev

5. Start the development server

yarn dev

6. Expose your app for webhooks (optional)

To receive webhooks from Creem, use a reverse proxy like NGROK.

​
Screenshots

Interactive onboarding

The template includes a step-by-step tutorial to help you get started and your account ready.

Product Catalog

Allows you to test your products in a easy way, without having to manually set product IDs

Account Management

Includes an account management page, to manage subscriptions, billing and customer portal links.

​
Features

Product Catalog

Fetch and display all products in your Creem account.

Checkout Sessions

Create checkout sessions for any product.

Subscription Management

Handle creation, cancellation, and expiration of subscriptions.

Customer Portal

Generate portal links for clients with active subscriptions.

Webhooks

Fulfill orders and update your app using Creem webhooks.

Auth

Minimal auth setup with BetterAuth.

​
Technology Stack

Next.js

App Router, SSR, and React Server Components.

Prisma

Type-safe ORM for database access (SQLite by default).

Creem SDK

Subscription and payment integration.

Shadcn UI

Accessible, beautiful React components.

Radix UI

Low-level UI primitives for React.

Tailwind CSS

Utility-first CSS for rapid UI development.

​
Resources

GitHub Repository

View the source code, open issues, or contribute.

Creem SDK Docs

Learn more about the Creem TypeScript SDK.

Next.js Documentation

Official Next.js docs for routing, SSR, and more.

Prisma Documentation

ORM docs and guides.

For feedback, feature requests, or to contribute, open an issue or pull request on the GitHub repository.