Get started with usage based billing for your OpenAI based apps!
This project generates marketing content using OpenAI, implements metered pricing model, checks for feature access based on their current subscription, reports usage of a feature, manages subscription and more using Tier.
- NextJS 13
/app
dir - AI content generation using OpenAI
- Pricing using Tier and Stripe.
- Pricing model using Tier Model Builder
- Subscriptions and Checkout
- Feature access and upsells
- Reporting usage of a feature
- Pricing table
- Customer billing portal
- Authentication using Auth.js
- ORM using Prisma
- Database on Vercel Postgres (Default) / Planetscale / Supabase
Tier decouples billing, metering, and access checks from your application code. With it, you can conveniently establish new pricing models without needing to restructure your app or concern yourself with grandfathering or breaking changes.
- Install dependencies
npm i
- Copy
.env.example
to.env.local
and update the variables.
cp .env.example .env.local
- Run the project locally
npm run dev
- Prod - https://model.tier.run/clhdwdn8v01zgkef5viv10kwr
- Staging - https://model.tier.run/clhdwboez01uqkef5s0qailg5
- Dev - https://model.tier.run/clhdvg0ab01i7kef5dy920jm6
You can clone the pricing model from the above links and make it your own.
We have considerably reduced the number of environment variables in the project to make it easier for you to get started. This is an exhaustive list of all the environment variables in the project
- App:
NEXT_PUBLIC_APP_URL
- The is the URL of your application, if you are in the middle of using our deploy button for Vercel, you can open vercel dashboard in another window and visit https://vercel.com/jerric-tier/project-name/settings/domains by replacingproject-name
with yours, make sure to appendhttps://
to your domain. In local dev mode, you can set this variable inenv.local / env.development
and give it this valuehttp://localhost:3000
. - Auth:
NEXTAUTH_URL
- Used by Auth.JS - When deploying to vercel you do not have to set this value, but when you develop you can set this ashttp://localhost:3000
. Find more details here. - Auth:
NEXTAUTH_SECRET
- Used by Auth.JS - Used to encrypt JWT and you can easily generate a secret usingopenssl rand -base64 32
. Find more details here. - Github OAuth:
GITHUB_CLIENT_ID
andGITHUB_CLIENT_SECRET
- Both Client ID and Client Secret of Github App can be generated at your Github Developer Settings page and you can read the step-by-step directions here. You can provide yourNEXT_PUBLIC_APP_URL
as the Homepage URL and append/api/auth/callback/github
for the callback URL - Tier:
TIER_BASE_URL
&TIER_API_KEY
- You can set yourTIER_BASE_URL
variable ashttps://api.tier.run
default value in all your environments andTIER_API_KEY
is your Stripe secret key. You can follow the steps in our docs to sync your pricing model with your Stripe account. - OpenAI:
OPENAI_API_KEY
- Get your OpenAI API key from OpenAI User Settings - Vercel Storage:
POSTGRES_PRISMA_URL
&POSTGRES_URL_NON_POOLING
- You will only need these two variables after you have setup your database as we are using Prisma. You can find more details here.
This example is powered by the following services:
- Tier (Subscriptions and Pricing)
- OpenAI (AI API)
- Vercel (Hosting NextJS)
- Auth.js (Auth)
- Vercel Postgres (default) / Supabase / Planetscale (Database)
- Stripe (Payments)
- Infisical (Secrets)
License under the MIT license.