Admin sidebar layout structure

// app/admin/layout.tsx
export default function AdminLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <div className="flex min-h-screen">
      {/* Sidebar: fixed width, independent scroll */}
      <aside className="w-64 bg-sidebar border-r
                        flex-shrink-0 overflow-y-auto">
        <AdminSidebar />
      </aside>

      {/* Main content area */}
      <main className="flex-1 p-6 overflow-y-auto">
        {children}
      </main>
    </div>
  );
}

Admin route structure

app/admin/
  layout.tsx          # Sidebar + main layout
  page.tsx            # Dashboard (stats overview)
  members/
    page.tsx          # Member list + search
    [id]/page.tsx     # Member detail/edit
  content/
    page.tsx          # Content management
  seo/
    page.tsx          # SEO status (IndexNow, etc.)
  pagespeed/
    page.tsx          # PageSpeed results
  email/
    page.tsx          # Email sending
  settings/
    page.tsx          # Service settings

Dashboard page example

// app/admin/page.tsx
export default async function AdminDashboard() {
  const stats = await getAdminStats();

  return (
    <div>
      <h1 className="text-2xl font-bold mb-6">Dashboard</h1>
      <div className="grid grid-cols-4 gap-4">
        <StatCard label="Total Members" value={stats.totalMembers} />
        <StatCard label="Today's Visitors" value={stats.todayVisitors} />
        <StatCard label="Blog Posts" value={stats.totalPosts} />
        <StatCard label="Avg PageSpeed" value={stats.avgPageSpeed} />
      </div>
    </div>
  );
}

middleware.ts — protecting admin routes

import { NextResponse } from "next/server";
import type { NextRequest } from "next/server";

export function middleware(request: NextRequest) {
  const { pathname } = request.nextUrl;

  // Protect /admin routes
  if (pathname.startsWith("/admin")) {
    const sessionCookie = request.cookies.get("better-auth.session_token");

    if (!sessionCookie) {
      return NextResponse.redirect(
        new URL("/auth/login", request.url)
      );
    }

    // Session validity verified in server components
  }

  return NextResponse.next();
}

export const config = {
  matcher: ["/admin/:path*"],
};

API route structure

app/api/admin/
  members/
    route.ts           # GET: list, POST: create
    [id]/
      route.ts         # GET: detail, PUT: update, DELETE: delete
  pagespeed/
    route.ts           # POST: run measurement
    results/
      route.ts         # GET: fetch results
  indexnow/
    route.ts           # POST: submit URLs
    history/
      route.ts         # GET: submission history

Member management API example

// app/api/admin/members/route.ts
import { adminGuard } from "@/lib/admin-auth";
import { db } from "@/lib/db";
import { users } from "@/lib/db/schema";

export async function GET(req: Request) {
  const session = await adminGuard();
  if (session instanceof NextResponse) return session;

  const { searchParams } = new URL(req.url);
  const page = Number(searchParams.get("page")) || 1;
  const limit = 20;

  const members = await db
    .select()
    .from(users)
    .limit(limit)
    .offset((page - 1) * limit)
    .orderBy(users.createdAt);

  return NextResponse.json({ members, page, limit });
}