zod

typescript
import axios from 'axios';

export type NormalizedErrors = {
  fields: Record<string, string>;
  formLevel: string | null;
};

Frontend: normalize and display server validation errors

ux typescript react
by codesnips 3 tabs
typescript
import { z } from "zod";

const booleanFromString = z.preprocess((val) => {
  if (typeof val !== "string") return val;
  return ["true", "1", "yes", "on"].includes(val.toLowerCase());
}, z.boolean());

Typed env parsing with zod

typescript zod validation
by codesnips 3 tabs
typescript
import { OpenAPIRegistry, extendZodWithOpenApi } from '@asteasolutions/zod-to-openapi';
import { z } from 'zod';

extendZodWithOpenApi(z);

export const registry = new OpenAPIRegistry();

OpenAPI generation for REST endpoints

typescript openapi zod
by codesnips 4 tabs
typescript
import { z } from "zod";

export const envSchema = z.object({
  VITE_API_URL: z.string().url(),
  VITE_APP_NAME: z.string().min(1).default("my-app"),
  VITE_ENABLE_ANALYTICS: z

Vite env handling: explicit prefixes only

vite frontend env
by codesnips 3 tabs
typescript
import { z } from 'zod'

export const postSchema = z.object({
  title: z
    .string()
    .min(5, 'Title must be at least 5 characters')

React Hook Form with Zod validation

react forms react-hook-form
by Maya Patel 2 tabs
typescript
export type ErrorCode =
  | 'VALIDATION'
  | 'UNAUTHENTICATED'
  | 'FORBIDDEN'
  | 'NOT_FOUND'
  | 'CONFLICT'

API error shape that frontend can rely on

typescript express react
by codesnips 4 tabs
javascript
const { z } = require('zod');

const signupSchema = z
  .object({
    email: z
      .string()

Reusable Zod Schema Validation Middleware for Express Signup Routes

express zod validation
by codesnips 3 tabs
typescript
import { z } from "zod";

const booleanFromString = z
  .string()
  .transform((v) => v.trim().toLowerCase())
  .pipe(z.enum(["true", "false", "1", "0"]))

Type-Safe Environment Variable Parsing and Validation With Zod

config zod environment
by codesnips 3 tabs
typescript
import { z } from 'zod';

export const signupSchema = z
  .object({
    email: z.string().min(1, 'Email is required').email('Enter a valid email'),
    password: z

React Hook Form + Zod resolver

react forms react-hook-form
by codesnips 3 tabs
typescript
import { z } from "zod";

export const signupSchema = z
  .object({
    email: z.string().min(1, "Email is required").email("Enter a valid email"),
    username: z

React Signup Form Validation With Zod and Field-Level Errors

react zod forms
by codesnips 3 tabs
typescript
import { initTRPC, TRPCError } from '@trpc/server';

export interface Context {
  user: { id: string; role: 'user' | 'admin' } | null;
  db: DatabaseClient;
}

tRPC router pattern for type-safe APIs

typescript trpc api
by codesnips 4 tabs
typescript
import { z } from 'zod';

export const createUserSchema = z
  .object({
    email: z.string().email(),
    name: z.string().min(1).max(120),

Runtime validation for request bodies (Zod)

typescript validation api
by codesnips 3 tabs