htmelvis / next-stripe-supabase

e-commerce with subscription and subscription management via stripe and real time db supabase

Next.js + Tailwind CSS Example

This example shows how to use Tailwind CSS (v3.0) with Next.js. It follows the steps outlined in the official Tailwind docs.

Preview

Preview the example live on StackBlitz:

Deploy your own

Deploy the example using Vercel:

How to use

Execute create-next-app with npm or Yarn to bootstrap the example:

npx create-next-app --example with-tailwindcss with-tailwindcss-app
# or
yarn create next-app --example with-tailwindcss with-tailwindcss-app

Deploy it to the cloud with Vercel (Documentation).

Create a live environment

You will have to recreate the products, update the API routes and the Keys Create a CLIENT_URL .env entry with the actual live clienturl Be sure to add the production or live keys from your live environment in your Vercel Acct

Enable customer portal and update the details and the new products and give the actual URLs for the production terms and privacy etc.

Reset the webhooks and add the endpoint for vercel App

choose the events to listen to as well (get new secrets and keys from the events) Add the stripe signing secret to the vercel env vars as well

update the supabase users and urls as well