Zod'u kurun:
npm install zod
Temel şema tanımlaması ve doğrulama:
import { z } from 'zod';
const schema = z.object({
name: z.string(),
age: z.number().positive().int(),
email: z.string().email(),
});
type User = z.infer<typeof schema>; // Şemadan TypeScript türü çıkarma
const result = schema.safeParse({
name: 'John Doe',
age: 30,
email: 'john@example.com',
});
if (result.success) {
console.log('Geçerli veri:', result.data);
} else {
console.log('Doğrulama hataları:', result.error.errors);
}
Çeşitli string doğrulama yöntemleri:
const stringSchema = z.object({
username: z.string()
.min(3, 'Kullanıcı adı en az 3 karakter olmalıdır')
.max(20, 'Kullanıcı adı 20 karakteri geçmemelidir')
.regex(/^[a-zA-Z0-9]+$/, 'Kullanıcı adı yalnızca alfanümerik karakterler içerebilir'),
email: z.string().email('Geçersiz e-posta adresi'),
password: z.string()
.min(8, 'Şifre en az 8 karakter olmalıdır')
.regex(/[A-Z]/, 'Şifre en az bir büyük harf içermelidir')
.regex(/[0-9]/, 'Şifre en az bir rakam içermelidir'),
url: z.string().url('Geçersiz URL'),
});
Sayı doğrulama yöntemleri:
const numberSchema = z.object({
age: z.number()
.positive('Yaş pozitif bir sayı olmalıdır')
.int('Yaş bir tam sayı olmalıdır')
.min(18, 'En az 18 yaşında olmalısınız')
.max(100, 'En fazla 100 yaşında olmalısınız'),
price: z.number()
.positive('Fiyat pozitif olmalıdır')
.multipleOf(0.01, 'Fiyat en fazla 2 ondalık basamağa sahip olmalıdır')
.max(1000000, 'Fiyat 1.000.000'den küçük olmalıdır'),
});
Boolean doğrulama:
const booleanSchema = z.object({
agreeToTerms: z.boolean()
.refine((val) => val === true, 'Şartları kabul etmelisiniz'),
receiveNewsletter: z.boolean().optional(),
});
Tarih doğrulama yöntemleri:
const dateSchema = z.object({
birthDate: z.date()
.max(new Date(), 'Doğum tarihi gelecekte olamaz'),
appointmentDate: z.date()
.min(new Date(), 'Randevu tarihi gelecekte olmalıdır'),
});
Dizi doğrulama yöntemleri:
const arraySchema = z.object({
tags: z.array(z.string())
.nonempty('En az bir etiket gereklidir')
.max(5, 'Maksimum 5 etiket izin verilir'),
scores: z.array(z.number().positive().int())
.min(3, 'En az 3 not gereklidir'),
});
İç içe geçmiş nesne doğrulama:
const addressSchema = z.object({
street: z.string(),
city: z.string(),
zipCode: z.string().regex(/^d{5}$/, 'Geçersiz posta kodu'),
});
const userSchema = z.object({
name: z.string(),
email: z.string().email(),
address: addressSchema,
});
Birleşim ve kesişim türlerinin kullanımı:
const unionSchema = z.union([
z.string(),
z.number(),
z.boolean(),
]);
const intersectionSchema = z.intersection(
z.object({ name: z.string() }),
z.object({ age: z.number() })
);
Enum şemaları oluşturma:
const RoleEnum = z.enum(['admin', 'user', 'guest']);
const userSchema = z.object({
name: z.string(),
role: RoleEnum,
});
Opsiyonel ve nullable alanların yönetimi:
const schema = z.object({
name: z.string(),
middleName: z.string().optional(),
nickname: z.string().nullable(),
age: z.number().optional().nullable(),
});
optional(): Alan mevcut olabilir ya da olmayabilir (değerini sağlanmadığında undefined olabilir).
nullable(): Alan mevcut olmalı ama açıkça null olarak ayarlanabilir.
Özel doğrulama kuralları oluşturma:
const customSchema = z.object({
password: z.string()
.min(8)
.refine((val) => /[A-Z]/.test(val), 'Şifre bir büyük harf içermelidir')
.refine((val) => /[0-9]/.test(val), 'Şifre bir rakam içermelidir'),
confirmPassword: z.string(),
}).refine((data) => data.password === data.confirmPassword, {
message: "Şifreler uyuşmuyor",
path: ["confirmPassword"],
});
Doğrulama hatalarının yönetimi:
const schema = z.object({
name: z.string(),
email: z.string().email(),
});
const result = schema.safeParse({ name: '', email: 'geçersiz' });
if (!result.success) {
console.log('Doğrulama hataları:');
result.error.issues.forEach((issue) => {
console.log(`${issue.path.join('.')}: ${issue.message}`);
});
}
Parçalama ve güvenli parçalama yöntemlerinin kullanımı:
const schema = z.object({
name: z.string(),
age: z.number(),
});
// Parçalama (geçersizse hata fırlatır)
try {
const data = schema.parse({ name: 'John', age: '30' });
console.log('Parçalanmış veri:', data);
} catch (error) {
if (error instanceof z.ZodError) {
console.log('Doğrulama hataları:', error.errors);
}
}
// Güvenli parçalama (başarı/hata nesnesi döner)
const result = schema.safeParse({ name: 'John', age: '30' });
if (result.success) {
console.log('Geçerli veri:', result.data);
} else {
console.log('Doğrulama hataları:', result.error.errors);
}
Zod'u React ve React Hook Form gibi bir form kütüphanesi ile kullanma:
import React from 'react';
import { useForm } from 'react-hook-form';
import { zodResolver } from '@hookform/resolvers/zod';
import { z } from 'zod';
const schema = z.object({
name: z.string().min(1, 'İsim gereklidir'),
email: z.string().email('Geçersiz e-posta'),
});
type FormData = z.infer<typeof schema>;
function Form() {
const { register, handleSubmit, formState: { errors } } = useForm<FormData>({
resolver: zodResolver(schema),
});
const onSubmit = (data: FormData) => console.log(data);
return (
<form onSubmit={handleSubmit(onSubmit)}>
<input {...register("name")} />
{errors.name && <p>{errors.name.message}</p>}
<input {...register("email")} />
{errors.email && <p>{errors.email.message}</p>}
<button type="submit">Gönder</button>
</form>
);
}
2024 © Tüm hakları saklıdır - buraxta.com