Productivity

clerk-auth

sickn33/antigravity-awesome-skills · updated Apr 8, 2026

$npx skills add https://github.com/sickn33/antigravity-awesome-skills --skill clerk-auth
summary

Expert patterns for Clerk authentication, middleware, route protection, and server-side user access in Next.js.

  • Covers Next.js 14/15 App Router setup with ClerkProvider, pre-built sign-in/sign-up components, and user session management via UserButton
  • Middleware-based route protection using clerkMiddleware and createRouteMatcher for centralized auth logic across route groups
  • Server Component authentication via auth() and currentUser() functions to access userId, sessionId, orgId, and
skill.md

Clerk Authentication

Patterns

Next.js App Router Setup

Complete Clerk setup for Next.js 14/15 App Router.

Includes ClerkProvider, environment variables, and basic sign-in/sign-up components.

Key components:

  • ClerkProvider: Wraps app for auth context
  • , : Pre-built auth forms
  • : User menu with session management

Middleware Route Protection

Protect routes using clerkMiddleware and createRouteMatcher.

Best practices:

  • Single middleware.ts file at project root
  • Use createRouteMatcher for route groups
  • auth.protect() for explicit protection
  • Centralize all auth logic in middleware

Server Component Authentication

Access auth state in Server Components using auth() and currentUser().

Key functions:

  • auth(): Returns userId, sessionId, orgId, claims
  • currentUser(): Returns full User object
  • Both require clerkMiddleware to be configured

⚠️ Sharp Edges

Issue Severity Solution
Issue critical See docs
Issue high See docs
Issue high See docs
Issue high See docs
Issue medium See docs
Issue medium See docs
Issue medium See docs
Issue medium See docs

When to Use

This skill is applicable to execute the workflow or actions described in the overview.