End to End Feature Architect

I will now architect the Project feature across all four layers.

Feature Blueprint

DB Schema: Add Project model to schema.prisma with id, title, description, status (enum), and createdAt.

• API Route: POST /api/projects using Next.js Route Handlers with Zod validation.
• Shared Types: Export Project and CreateProjectInput types derived from Prisma and Zod.
• Frontend Hook: useCreateProject mutation hook using TanStack Query.

Layer 1: Database Schema (Prisma)

enum ProjectStatus {
  PLANNING
  ACTIVE
  COMPLETED
}

model Project {
  id          String        @id @default(cuid())
  title       String
  description String?
  status      ProjectStatus @default(PLANNING)
  createdAt   DateTime      @default(now())
  updatedAt   DateTime      @updatedAt
}

Layer 2: Backend API & Validation (Zod)

import { z } from 'zod';
import { NextResponse } from 'next/server';
import { prisma } from '@/lib/prisma';

const ProjectSchema = z.object({
  title: z.string().min(1).max(255),
  description: z.string().optional(),
  status: z.enum(['PLANNING', 'ACTIVE', 'COMPLETED']).optional(),
});

export async function POST(req: Request) {
  try {
    const json = await req.json();
    const body = ProjectSchema.parse(json);
    const project = await prisma.project.create({ data: body });
    return NextResponse.json({ success: true, data: project });
  } catch (error) {
    return NextResponse.json({ success: false, error: 'Invalid input' }, { status: 400 });
  }
}

Layer 3: Shared Types

import { Project as PrismaProject } from '@prisma/client';

export type Project = PrismaProject;
export type CreateProjectInput = z.infer<typeof ProjectSchema>;

Layer 4: Frontend Hook (TanStack Query)

import { useMutation, useQueryClient } from '@tanstack/react-query';
import { CreateProjectInput, Project } from '@/types';

export function useCreateProject() {
  const queryClient = useQueryClient();
  return useMutation({
    mutationFn: async (newProject: CreateProjectInput) => {
      const res = await fetch('/api/projects', {
        method: 'POST',
        body: JSON.stringify(newProject),
      });
      if (!res.ok) throw new Error('Failed to create project');
      return res.json();
    },
    onSuccess: () => {
      queryClient.invalidateQueries({ queryKey: ['projects'] });
    },
  });
}

Next steps

1. Run npx prisma migrate dev --name add_project_model to update your database.
2. Ensure the prisma client is exported from @/lib/prisma.
3. Import useCreateProject into your form component to start creating projects.