Next.js v15 TDD Supastarter 🤩
Next.js, Supabase, Drizzle, Jest

Build durable, tested, type-safe apps with Next.js 15 and Supabase

This project integrates Next.js 15, with the Vercel boilerplate examples from with-supabase, with-jest, and postgres-drizzle, fixes a few issues and sets up a hyper-efficient run-on-save, debugger-ready TDD workflow in VS Code.

💎 Features · 🚗 Clone and run · 🧪 Streamlined testing · 👋 Feedback and issues

Features

• Run-on-save Jest tests with VS Code debugging preconfigured (video below 📺)
• Debugger set up for both test and dev scripts. Just add breakpoints
• Works across the Next.js stack
  • App Router
  • Middleware
  • Client
  • Server
• User signup, auth and protected routes
• Styling with Tailwind CSS
• Components with shadcn/ui
• Drizzle integration, which assumes the Supabase with Next.js schema
• Simple migrations

Clone and run

1. Clone this repo

2. Set up a Supabase project

3. Copy settings in Supabase: Supabase dashboard > Connect (top left) > App Frameworks > Next.js

4. Copy .env.example to .env and update:
   

   • NEXT_PUBLIC_SUPABASE_URL
   • NEXT_PUBLIC_SUPABASE_ANON_KEY Both can be found in your Supabase project's API settings.
   • DATABASE_URL Find from the Supabase Dashboard > Connect

5. Install dependencies

   npm install

6. Run the Next.js local development server:

   npm run dev

7. This template comes with the default shadcn/ui style initialized. If you instead want other ui.shadcn styles, delete components.json and re-install shadcn/ui

Check out the docs for Local Development to also run Supabase locally.

Testing

tdd-supastar-demo.mp4

Run and watch tests:

  npm run test:inspect

A VS Code launch.json file is included, allowing you to just open Debug sidebar to attach the VS Code.

Just hit save to run tests. Add breakpoints. See to see what's going on. 🔬

Database Migrations

When your schema changes:

• run npm run db:generate
• look in drizzle folder for the newly generated sql file
• manually apply the sql to your database

It's simple and durable way to operate on your production and dev database.

Feedback and issues

This is not an official Supabase or Vercel project. It's just my own personal preference and dev workflow that I thought I would share. Feel free to create issues, fork and improve this project. Drop a ⭐️ if you'd like. Sometimes I am also hiring. Connect with me on Twitter @rsweetland