Clerk & Supabase Auth

~18 min · Clerk, Supabase Auth, managed auth

Level 0Curious

0 XP0/68 lessons0/11 achievements

0/120 XP to next level120 XP to go0% complete

When you'd use a managed auth service

Clerk and Supabase Auth absorb the auth UI, password resets, magic links, MFA, and session management. You write less code; you sign up for a vendor.

Comparison

Feature	Auth.js v5	Clerk	Supabase Auth
Cost	Free (self-hosted)	Free tier; paid plans	Free tier; paid plans
Setup time	Medium	Easy	Medium
Pre-built UI	None (BYO)	Yes	Auth UI package
Database	Any (adapter)	Managed	Postgres included
Social providers	80+	20+	20+

Picking

Clerk if you want zero auth UI work and accept the cost. Supabase if you also want the database and Row-Level Security from the same vendor. Auth.js if you want full control with no vendor.

Code

Clerk — matcher protects routes·ts

// proxy.ts
import { clerkMiddleware, createRouteMatcher } from '@clerk/nextjs/server';

const isProtected = createRouteMatcher(['/dashboard(.*)', '/api(.*)']);

export default clerkMiddleware((auth, req) => {
  if (isProtected(req)) auth().protect();
});

Supabase Auth — Server Component reads session·ts

// lib/supabase/server.ts
import { createServerClient } from '@supabase/ssr';
import { cookies } from 'next/headers';

export async function createClient() {
  const store = await cookies();
  return createServerClient(
    process.env.NEXT_PUBLIC_SUPABASE_URL!,
    process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!,
    {
      cookies: {
        getAll: () => store.getAll(),
        setAll: (cs) => cs.forEach(({ name, value, options }) => store.set(name, value, options)),
      },
    }
  );
}

External links

Exercise

For your project, write a one-page decision: Auth.js, Clerk, or Supabase Auth? Cost, social providers needed, UI control, vendor risk. Pick one and justify.