In larger React applications, validation logic should be structured in a clear and reusable way. Keeping Zod schemas organized helps reduce duplication, improves consistency, and makes your codebase easier to maintain as the project grows.

A recommended approach is to keep Zod schemas outside of React components. Place them in dedicated files or folders such as schemas or validation. This keeps UI code focused on rendering and interaction while validation rules remain centralized and easy to reuse.

When multiple forms share the same rules—such as email addresses, passwords, or user information—extract those rules into reusable schema fragments. For example, common field schemas can live in a shared file and be composed into larger form schemas using Zod's composition features. This ensures consistency and avoids repeating the same validation logic in multiple places.

Schemas are often grouped by feature or domain. Authentication-related schemas might live in authSchemas.ts, while user-related schemas belong in userSchemas.ts. This structure makes it easy to locate and update validation rules and supports collaboration in larger teams.

Here is a simple example of reusable validation logic:

// fields.ts
import { z } from "zod";

export const emailSchema = z.string().email("Invalid email address");

You can then reuse this field in multiple form schemas:

// userSchemas.ts
import { z } from "zod";
import { emailSchema } from "./fields";

export const registerSchema = z.object({
  email: emailSchema,
  password: z.string().min(8, "Password must be at least 8 characters"),
});

export const loginSchema = z.object({
  email: emailSchema,
  password: z.string(),
});