TanStackIntermediate

Zod Schema — Validation

zod v4-এ product schema, coerce, partial update ও error message — বাংলায়।

7টি অংশবাংলা ভাষায়

zodResolver দিয়ে RHF-কে আঙ্গুলে zest schema-এর ভিত্তিতে validate করে। schema টাইপ → CreateProductInput-এর উৎস। Zod 4 ব্যবহার করছি (project-এ zod: ^4)।

src/lib/validators/product-schema.tsts

import { z } from "zod";

export const categorySchema = z.enum([
  "electronics",
  "clothing",
  "books",
  "food",
]);

export const productSchema = z.object({
  name: z.string().min(1, "নাম আবশ্যক").max(80),
  description: z.string().max(500).optional(),
  // form থেকে আসা string → number
  price: z.coerce.number()
    .finite("সঠিক দাম দিন")
    .min(1, "দাম ১-এর বেশি হওয়া উচিত"),
  category: categorySchema,
  stock: z.coerce.number().int().min(0, "Stock ঋণাত্মক নয়"),
  status: z.enum(["active", "inactive"]),
});

export type CreateProductInput = z.infer<typeof productSchema>;

// edit-এ সব field বাধ্যতামূলক নয় চাইলে
export const updateProductSchema = productSchema.partial();
export type UpdateProductInput = z.infer<typeof updateProductSchema>;

z.enum + category types

z.enum([...]) থেকে আমরা type derive করি — যেন category ভুল টাইপ compile-time-এই আটকায়। এভাবে API types ও form schema একটাই সত্যের উৎস (single source).

zodResolver যুক্ত করা

Resolver-সহ useFormtsx

tsx

import { zodResolver } from "@hookform/resolvers/zod";
import { productSchema } from "@/lib/validators/product-schema";

useForm<CreateProductInput>({
  resolver: zodResolver(productSchema),
  defaultValues: {
    name: "",
    description: "",
    price: 0,
    category: "electronics",
    stock: 0,
    status: "active",
  },
});

coerce কেন

HTML type="number" input-এর concern string — কিন্তু আমরা চাই number। z.coerce.number() আগে শুধু string-কে number-এ রূপান্তর করে, তারপর validate করে। ছাড়া হলে type mismatch-এ resolver quarterback হতো।

শেষ প্যারায় নিজে practice করুন — কোড কপি করে নিজের এডিটরে চালিয়ে দেখুন।