supabase-nextjs

Integrate Supabase authentication with Drizzle ORM in Next.js App Router apps.

Updated Jan 9, 2026
One-click install
npx skills add https://github.com/SKANL/saas-abogados-nextjs --skill supabase-nextjs-skanl
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: supabase-nextjs
Source: https://github.com/SKANL/saas-abogados-nextjs/tree/main/.agents/skills/supabase-nextjs
Command: npx skills add https://github.com/SKANL/saas-abogados-nextjs --skill supabase-nextjs-skanl

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill simplifies building full-stack Next.js apps by combining App Router patterns with Supabase authentication and Drizzle ORM for type-safe database access.

Core Features & Use Cases

  • Server-first architecture: leverage Next.js server components with Supabase auth and Drizzle for queries.
  • Auth + storage + realtime: provide authentication flows, storage, and realtime updates via Supabase.
  • Use Case: imagine a dashboard where users sign in, manage profiles, and perform CRUD on posts with real-time updates.

Quick Start

Install dependencies, configure environment variables (NEXT_PUBLIC_SUPABASE_URL, NEXT_PUBLIC_SUPABASE_ANON_KEY, DATABASE_URL), then run npm run dev to start the app.

Frequently Asked Questions about supabase-nextjs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I integrate Supabase authentication with Drizzle ORM in Next.js App Router server components?

To integrate Supabase authentication with Drizzle ORM in Next.js server components, use middleware-based session handling and server-side Supabase clients to enforce secure access, then execute type-safe database queries directly within your server components.

What environment variables do I need to configure for a Next.js project using Supabase and Drizzle ORM?

You need to configure NEXT_PUBLIC_SUPABASE_URL, NEXT_PUBLIC_SUPABASE_ANON_KEY, and DATABASE_URL environment variables to establish secure connections between your Next.js app, Supabase authentication, and your PostgreSQL database via Drizzle ORM.

Can I use Supabase realtime and storage features in a Next.js application with Drizzle ORM?

Yes, you can implement Supabase realtime and storage features in Next.js applications alongside Drizzle ORM by leveraging Supabase clients to handle realtime updates and file storage while maintaining type-safe database queries.

What is the best way to structure a full-stack Next.js app with Supabase for server-side database access?

The best way to structure a full-stack Next.js app with Supabase is using a server-first architecture that leverages App Router server components for rendering, middleware for session handling, and Drizzle ORM for type-safe PostgreSQL database queries.

Does Drizzle ORM work with Supabase PostgreSQL for type-safe queries in Next.js server components?

Yes, Drizzle ORM works with Supabase PostgreSQL to provide type-safe database queries in Next.js server components by enforcing server-side access through dedicated Drizzle clients and Supabase clients configured via environment variables.