TutorialsPrivate page

Private page

Once user is authentified, you can build private routes like a user dashboard, account, etc.

💡

If you want to make protected API calls, follow this tutorial.

The layout.js 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.js)

Here’s an example of a simple user dashboard showing private user data in a server component:

/app/dashboard/page.js
import { getServerSession } from "next-auth";
import { authOptions } from "@/libs/next-auth";
import connectMongo from "@/libs/mongoose";
import User from "@/models/User";
 
export default async function Dashboard() {
  await connectMongo();
  const session = await getServerSession(authOptions);
  const user = await User.findById(session.user.id);
 
  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">
            User Dashboard
          </h1>
          <p>Welcome {user.name} 👋</p>
          <p>Your email is {user.email}</p>
        </section>
      </main>
    </>
  );
}