Welcome, {user?.firstName}
Welcome, {user.email}
:Please sign in
} ``` Source: [Firebase Auth Web](https://firebase.google.com/docs/auth/web/start) ### Supabase Auth + Next.js Supabase requires separate browser and server clients with manual cookie handling. The `@supabase/ssr` package handles session management across client and server boundaries. ```typescript // utils/supabase/server.ts import { createServerClient } from '@supabase/ssr' import { cookies } from 'next/headers' export async function createClient() { const cookieStore = await cookies() return createServerClient( process.env.NEXT_PUBLIC_SUPABASE_URL!, process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!, { cookies: { getAll() { return cookieStore.getAll() }, setAll(cookiesToSet) { try { cookiesToSet.forEach(({ name, value, options }) => cookieStore.set(name, value, options), ) } catch { // Called from Server Component; safe to ignore } }, }, }, ) } ``` The proxy layer handles token refresh and redirects unauthenticated users: ```typescript // proxy.ts import { createServerClient } from '@supabase/ssr' import { NextResponse, type NextRequest } from 'next/server' export async function proxy(request: NextRequest) { let supabaseResponse = NextResponse.next({ request }) const supabase = createServerClient( process.env.NEXT_PUBLIC_SUPABASE_URL!, process.env.NEXT_PUBLIC_SUPABASE_ANON_KEY!, { cookies: { getAll() { return request.cookies.getAll() }, setAll(cookiesToSet) { cookiesToSet.forEach(({ name, value }) => request.cookies.set(name, value)) supabaseResponse = NextResponse.next({ request }) cookiesToSet.forEach(({ name, value, options }) => supabaseResponse.cookies.set(name, value, options), ) }, }, }, ) const { data: { user }, } = await supabase.auth.getUser() if (!user && !request.nextUrl.pathname.startsWith('/login')) { const url = request.nextUrl.clone() url.pathname = '/login' return NextResponse.redirect(url) } return supabaseResponse } export const config = { matcher: ['/((?!_next/static|_next/image|favicon.ico|.*\\.(?:svg|png|jpg|jpeg|gif|webp)$).*)'], } ``` Source: [Supabase Next.js SSR](https://supabase.com/docs/guides/auth/server-side/nextjs) ### WorkOS + Next.js 16 WorkOS AuthKit has a clean 4-step setup. Authentication is redirect-based via hosted AuthKit. WorkOS explicitly supports Next.js 16's `proxy.ts` (which they note "was called middleware before Next 16"). ```typescript // proxy.ts import { authkitMiddleware } from '@workos-inc/authkit-nextjs' export default authkitMiddleware() export const config = { matcher: ['/((?!_next/static|_next/image|favicon.ico).*)'], } ``` Server-side auth uses `withAuth()`: ```typescript import { withAuth } from '@workos-inc/authkit-nextjs' export default async function DashboardPage() { const { user } = await withAuth({ ensureSignedIn: true }) return