Next.js

pnpm add @clowk/nextjs

NEXT_PUBLIC_CLOWK_PUBLISHABLE_KEY=pk_live_...
CLOWK_SECRET_KEY=sk_live_...

import { clowkMiddleware } from '@clowk/nextjs'

export default clowkMiddleware({
  secretKey: process.env.CLOWK_SECRET_KEY,
  publicRoutes: ['/', '/sign-in', '/sign-up'],
  signInUrl: '/sign-in',
})

export const config = {
  matcher: ['/((?!_next/static|_next/image|favicon.ico).*)'],
}

import { auth } from '@clowk/nextjs'
import { redirect } from 'next/navigation'

export default async function Dashboard() {
  const { user, signedIn } = await auth({
    secretKey: process.env.CLOWK_SECRET_KEY,
  })

  if (!signedIn) redirect('/sign-in')

  return (
    <div>
      <h1>Hello, {user?.name}</h1>
      <p>{user?.email}</p>
    </div>
  )
}

import { auth } from '@clowk/nextjs'
import { NextResponse } from 'next/server'

export async function GET() {
  const { user, signedIn } = await auth({
    secretKey: process.env.CLOWK_SECRET_KEY,
  })

  if (!signedIn) {
    return NextResponse.json({ error: 'Unauthorized' }, { status: 401 })
  }

  return NextResponse.json({ user })
}

'use client'

import { SignInButton, SignOutButton, useAuth } from '@clowk/nextjs'

export function Header() {
  const { signedIn, user } = useAuth()

  if (!signedIn) return <SignInButton />

  return (
    <div>
      <span>{user?.name}</span>
      <SignOutButton />
    </div>
  )
}