nextjs-supabase-auth

Integrate Supabase Auth with Next.js App Router using @supabase/ssr.

Updated Feb 24, 2026
One-click install
npx skills add https://github.com/nonputtipong/Oryn --skill nextjs-supabase-auth-nonputtipong
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: nextjs-supabase-auth
Source: https://github.com/nonputtipong/Oryn/tree/main/.agent/skills/nextjs-supabase-auth
Command: npx skills add https://github.com/nonputtipong/Oryn --skill nextjs-supabase-auth-nonputtipong

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill streamlines the integration of Supabase Authentication into Next.js applications, ensuring secure and efficient handling of user sessions and protected routes.

Core Features & Use Cases

  • App Router Integration: Expertly leverages @supabase/ssr for seamless Supabase Auth in Next.js App Router.
  • Middleware Protection: Implements robust authentication checks in middleware to secure routes.
  • Server Actions: Utilizes Server Actions for secure authentication operations.
  • Use Case: Protect your Next.js dashboard by ensuring only authenticated users can access specific pages, using Supabase for user management and authentication.

Quick Start

Configure Supabase Auth middleware to protect the '/dashboard' route in your Next.js application.

Frequently Asked Questions about nextjs-supabase-auth

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

FAQPage Schema
How do I protect routes in Next.js App Router using Supabase Auth?

You can secure Next.js App Router routes by implementing Supabase Auth checks within middleware. This approach intercepts requests to protect specified paths, ensuring only authenticated users access protected pages.

What is the best way to handle Supabase auth tokens in Next.js Server Actions?

The recommended approach for handling Supabase auth tokens in Next.js Server Actions is using @supabase/ssr. This Skill configures secure token management directly within Server Actions for safe authentication operations.

Does @supabase/ssr work with Next.js App Router for authentication?

Yes, @supabase/ssr integrates directly with Next.js App Router for authentication. This Skill leverages it to handle login flows, callbacks, and protected routes within the App Router architecture.

How do I configure Supabase Auth middleware for a Next.js dashboard?

Configure Supabase Auth middleware for a Next.js dashboard by defining route protection rules. This Skill provides the setup to verify user sessions and restrict dashboard access to authenticated users only.

Why use middleware for Supabase authentication instead of page-level checks?

Using middleware for Supabase authentication centralizes route protection before rendering. This Skill implements robust checks at the middleware level to secure routes consistently, preventing gaps in page-level authentication logic.