Technical Details of the Next.js Supabase SaaS Starter Kit

The kit is built as a Turborepo monorepo using these core technologies:

Key Libraries

• Shadcn UI (Radix-based) for accessible UI components
• React Query (@tanstack/react-query) for client-side data fetching
• Zod for schema validation
• Lucide for icons
• react.email for email templates
• Nodemailer or Resend for sending emails

The kit deploys to Vercel, Cloudflare, or any Node.js hosting. Edge runtime support enables deployment to Cloudflare Workers.

Monorepo Structure

Core Packages

Feature Packages

Located in packages/features/:

Billing Packages

Located in packages/billing/:

Infrastructure Packages

Application Configuration

Configuration files live in apps/web/config/:

Key Patterns

Server Actions

Use enhanceAction from @kit/next/actions for type-safe, validated server actions:

import { enhanceAction } from '@kit/next/actions';
import { z } from 'zod';
const schema = z.object({ name: z.string().min(1) });
// Authenticated action (default: auth is required)
export const updateName = enhanceAction(async (data, user) => {
  // data is validated, user is authenticated
}, { schema });
// Public action (no auth required)
export const submitContact = enhanceAction(async (data) => {
  // data is validated, no user required
}, { schema, auth: false });

By default, auth: true requires authentication. Set auth: false for public actions like contact forms.

Route Handlers

Use enhanceRouteHandler from @kit/next/routes for API routes:

import { enhanceRouteHandler } from '@kit/next/routes';
export const POST = enhanceRouteHandler(async ({ body, user }) => {
  // body is parsed, user is available
  return NextResponse.json({ success: true });
}, { schema: yourSchema });

Supabase Clients

// Server Components and Server Actions
import { getSupabaseServerClient } from '@kit/supabase/server-client';
// Admin operations (bypasses RLS)
import { getSupabaseServerAdminClient } from '@kit/supabase/server-admin-client';

Deployment Targets

The kit supports multiple deployment targets:

• Vercel: Zero-config deployment with environment variables
• Cloudflare Pages/Workers: Edge runtime support
• Docker: Self-hosted deployments
• Any Node.js host: Standard Next.js deployment

For production deployment, see the going to production checklist.