Show HN: I built a Free and Open Source SaaS Template with Next.js

This is a starter template for building SaaS applications using Next.js with support for Supabase authentication, Stripe payments and a dashboard for logged-in users.

• User authentication with Supabase.
• Subscription management with Stripe.
• Responsive design with Tailwind CSS.
• Dashboard for subscribed users.
• Form handling with React Hook Form and Zod.

• Next.js
• Supabase
• Stripe
• Tailwind CSS with daisyUI

Follow these steps to set up and run the project locally.

Ensure you have the following installed:

• Node.js
• A Supabase account
• A Stripe account
• Supabase CLI
• Stripe CLI

Follow these steps to set up and run the project locally:

1. Install Dependencies

2. Set Up Environment Variables

   Copy the .env.example file to .env.local and update it with your credentials:

   cp .env.example .env.local

3. Set up Supabase

   supabase login supabase link supabase db push

   To regenerate TypeScript types, use the following command:

   supabase gen types --lang typescript --project-id <your-project-id> > supabase/database.types.ts

4. Set Up Google OAuth

   Configure Google OAuth in your Supabase project by following the Supabase Google OAuth Guide.

5. Set up Stripe

   • Create a new product in Stripe and add pricing plans. Update the Pricing component in the codebase with the corresponding priceId values for each plan.
   • Add customer portal link in the CustomerPortalButton component.

6. Run Stripe CLI to test subscriptions

   stripe listen --forward-to localhost:3000/api/webhooks/stripe

7. Start the Development Server

To deploy the project, use a platform like Vercel.

Contributions are welcome! Feel free to open issues or submit pull requests.

This project is licensed under the MIT License.