A Next.js SaaS Boilerplate

This repository serves as a starting point (or boilerplate) for any Next.js SaaS project that requires user authentication and management and subscription payments. It currently uses Prisma with a Postgres database and is being built out using shadcn/ui components besides custom sass components when needed.

Live 👉 Firestarta.dev

Note

Now using yarn 4.1.0 through Corepack.

The stack

Changes or additions to teh stack will be updated here

• Next.js
• NextAuth
• Typescript
• Prisma
• Supabase (Postgres)
• Lemon Squeezy (Subscriptions)
• Sass
• shadcn/ui
• Lucide icons

Features

Features are developed in no specific order

• App directory
• Route Groups
• Intercepting & Parallel Routes
• CSR/SSR
• Subscriptions with Lemon Squeezy
• Basic SEO
• User Profiles
• Account Pages
• Custom Components
• Light/Dark Modes temporarily removed
• Responsive Design
• Light mode (Theme)
• Dasboard layouts
• Cookies
• Internationalisation (Multi-lingual)
• Custom errors
• Loading states loading.tsx
• Sitemap
• Manifest
• Blog

Preview

Setup

Create a .env.local file and generate NextAuth secret using:

openssl rand -base64 32

.env.local

NEXT_PUBLIC_SITE_URL=http://localhost:3000
NEXTAUTH_SECRET=
NEXTAUTH_URL=http://localhost:3000

GITHUB_SECRET=
GITHUB_ID=

DATABASE_URL=

LEMONSQUEEZY_STORE_ID=
LEMONSQUEEZY_API_KEY=
LEMONSQUEEZY_WEBHOOK_SECRET=

Set up GitHub Authentication

Tip

To setup Github visit https://github.com/settings/apps to create a new app. the callback URL should be: [origin]/api/auth/callback/[provider] as stated in the NextAuth documentation.

Getting Started

npx prisma migrate dev --name init
yarn dev

Open http://localhost:3000 with your browser to see the result.