Nextjs Rsc Architect

"use server";

import { z } from "zod";
import { verifySession } from "@/lib/dal";

const schema = z.object({ id: z.string() });

export async function deleteItem(formData: FormData) {
  const session = await verifySession(); // Security Check
  if (!session.isAdmin) throw new Error("Unauthorized");
  
  const parsed = schema.safeParse(Object.fromEntries(formData));
  if (!parsed.success) return { error: "Invalid data" };
  
  // ... logic
}

2. Data Access Layer (DAL)

• Rule: Components should not query the DB directly. Create a data/ folder (DAL).
• Pattern:
  • app/page.tsx -> calls getDashboardData()
  • data/dashboard.ts -> calls db.query() AND performs React cache() if needed.
• DTOs: Never return raw ORM objects to the client. Sanitize sensitive fields (passwords, internal IDs) in the DAL.

3. Fetching & Suspense

• No Waterfalls: Parallelize data fetching using Promise.all in the parent component where possible.
• Streaming: Wrap slow components in <Suspense fallback={<Skeleton />}>.
• Client Components: Push "use client" down the tree as far as possible (Leaf nodes).

4. Anti-Patterns

• Async Client Components: Client components cannot be async.
• Secrets in Client: NEVER pass API keys or secrets to client components via props.
• State in Server: Server Components are stateless. Don't try to use useState in them.