Next.js RSC Patterns

Project-agnostic App Router rules shared by 1chooo.com and JustHold.

Server Components by default

Pages and layouts are async Server Components unless they need interactivity. Fetch on the server; pass data as props to Client leaves.

export default async function FeatureLayout({ children }: { children: React.ReactNode }) {
  const supabase = await createClient()
  const { data: { user } } = await supabase.auth.getUser()
  if (!user) redirect('/sign-in?from=/member')
  return <>{children}</>
}

Push "use client" as far down the tree as possible.