javascript

Zod. Основные преимущества и неочевидные кейсы использования

  • понедельник, 4 ноября 2024 г. в 00:00:05
https://habr.com/ru/articles/855734/

Zod — это TypeScript библиотека для валидации и создания схем данных, позволяющая определять строгие типы на этапе разработки. Она значительно упрощает управление типами и обеспечивает безопасность данных в приложениях. В отличие от других решений для валидации данных, Zod написан на TypeScript и позволяет использовать строгую типизацию как на этапе компиляции, так и на этапе выполнения.

Для простых структур можно задать валидацию буквально в одной строке:

const userSchema = z.object({
  name: z.string(),
  age: z.number(),
  email: z.string().email()
});

Одним из ключевых преимуществ является автоматическая генерация TypeScript типов из схем Zod. Это избавляет от необходимости дублировать логику валидации и типизацию данных:

const user = userSchema.parse({
  name: "Aleksandr",
  age: 31,
  email: "aleksandr@google.com"
});

type User = z.infer<typeof userSchema>; // { name: string, age: number, email: string }

Zod также поддерживает продвинутые методы валидации: асинхронную валидацию, пользовательские валидаторы и возможность задавать условия на основании других значений в объекте:

const passwordSchema = z.string().min(8).max(20);
const customSchema = z.object({
  password: passwordSchema,
  confirmPassword: z.string().refine(
    (value, context) => value === context.parent.password,
    { message: "Пароли должны совпадать" }
  )
});

Композируемость. В Zod схемы можно легко комбинировать и расширять:

const baseUserSchema = z.object({
  name: z.string(),
  age: z.number().min(18),
});

const adminSchema = baseUserSchema.extend({
  isAdmin: z.boolean(),
});

Теперь, когда мы вспомнили/познакомились с основами работы с Zod, можно перейти к неочевидным и полезным вариантам использования.

🔥 Валидация данных с API. Zod идеально подходит для валидации данных, полученных с внешних API. Это помогает избежать ошибок при работе с неподтвержденными данными, особенно если API меняет свою структуру.

const apiResponseSchema = z.object({
  data: z.array(z.object({
    id: z.number(),
    title: z.string(),
  }))
});

fetch("/api/posts")
  .then(response => response.json())
  .then(data => {
    const result = apiResponseSchema.safeParse(data);
    if (!result.success) {
      console.error("Ошибка. Неподдерживаемый тип response: ", result.error);
    }
  });

🔥 Конфигурации приложений. Zod можно использовать для строгой валидации конфигурационных файлов (например, .env). Это гарантирует корректность настроек на разных окружениях и помогает находить ошибки до запуска приложения:

const configSchema = z.object({
  PORT: z.string().regex(/^\d+$/).transform(Number),
  DATABASE_URL: z.string().url(),
});

const config = configSchema.parse(process.env);

🔥 Валидация сложных форм. Скорее всего, вы это уже использовали, но если для кого то в новинку, то будет крайне полезно. В комбинации с React или другими библиотеками Zod помогает создавать более надежные интерфейсы с минимальными усилиями:

const formDataSchema = z.object({
  fields: z.array(z.object({
    label: z.string(),
    value: z.union([z.string(), z.number()]),
  }))
});

А какие кейсы вы встречали, где можно бы было применить Zod и улучшить приложение?
Буду рад узнать и обсудить другие варианты применения библиотеки.

Больше о фронтенде, технологиях и новостях в мире JS в моемТГК — aleksandr_frontend