Once user is authentified, you can build private routes like a user dashboard, account, etc.
The layout.tsx in /dashboard ensures any pages & subpages are private. If the user is not authenticated, he'll be redirected to the login page: see auth in config.ts
EX: A simple user dashboard showing private user data in a server component:
/app/page.tsx
import { cookies } from "next/headers";
import { createServerComponentClient } from "@supabase/auth-helpers-nextjs";
export const dynamic = "force-dynamic";
export default async function Dashboard() {
const supabase = createServerComponentClient({ cookies });
const { data } = await supabase.from("todos").select();
return (
<main className="min-h-screen p-8 pb-24">
<section className="max-w-xl mx-auto space-y-8">
<h1 className="text-3xl md:text-4xl font-extrabold">Private Page</h1>
{/* You will only see something if you create an SQL table called todos with at least 1 row */}
<pre>{JSON.stringify(data, null, 2)}</pre>
</section>
</main>
);
}