Form validasyonu neden hem frontend'de hem backend'de yapılmalıdır? Aynı şemayı iki tarafta nasıl paylaşırsınız?

Frontend validasyonu kullanıcı deneyimi içindir (anında geri bildirim, gereksiz istek atmama); backend validasyonu ise güvenlik ve veri bütünlüğü içindir. Frontend kontrolü DevTools, curl veya Postman ile kolayca atlatılabilir, bu yüzden asıl doğrulama her zaman backend'de olmalıdır.

Bazı kurallar sadece backend'de doğrulanabilir: "bu e-posta zaten kayıtlı mı?", "kullanıcının bakiyesi yeterli mi?", "kupon geçerli mi?".

Şemayı paylaşmak (TypeScript monorepo)

Zod gibi bir kütüphane ile şema ortak bir pakette tanımlanır, hem formda hem API'de kullanılır:

// packages/shared/schemas.ts
import { z } from "zod";
export const signupSchema = z.object({
  email: z.email("Geçerli bir e-posta girin"),   // Zod 4; Zod 3: z.string().email()
  password: z.string().min(8, "En az 8 karakter"),
});
export type SignupInput = z.infer<typeof signupSchema>;

// Frontend: react-hook-form
const form = useForm<SignupInput>({ resolver: zodResolver(signupSchema) });

// Backend: aynı şema
app.post("/api/signup", (req, res) => {
  const parsed = signupSchema.safeParse(req.body);
  if (!parsed.success) return res.status(400).json({ errors: z.flattenError(parsed.error).fieldErrors });
  // ...
});

Backend farklı bir dildeyse (Java, Go) şema OpenAPI / JSON Schema'dan üretilebilir. Backend'den dönen alan bazlı hatalar (fieldErrors) formda ilgili alanın altında gösterilmelidir; böylece sadece backend'de yakalanan "e-posta kullanımda" hatası da doğru yerde görünür.