Zod: строгая валидация и удобная типизация. Опыт перехода

Привет, Хабр! Меня зовут Сергей, я фронтенд-инженер в Банки.ру. В этой статье расскажу, как Zod помог нам перестать писать валидацию на уровне полей, подружился с React Hook Form и стал единым источником правды о структуре данных. К Zod мы пришли не сразу. Долгое время типы и валидация у нас жили в разных слоях приложения: TypeScript определял структуру данных во время разработки, а отдельные функции или библиотеки (вроде Yup) проверяли входящие значения в рантайме. Это классическая проблема: дублирование логики и рассинхрон. Типы в interface поменялись, а валидация осталась прежней (или наоборот). Мы пробовали Yup, но он казался громоздким в связке с TS: типы приходилось выводить вручную или мириться с тем, что схемы выглядят непрозрачно. В какой-то момент стало непонятно: зачем тащить отдельную библиотеку, если проще написать if (typeof x === 'string') ? С переходом на Zod всё стало значительно проще: одна схема одновременно является и валидатором, и источником типа данных.

https://habr.com/ru/companies/banki/articles/994886/

#zod #typescript #валидация_данных #runtime_валидация #react_hook_form #типизация_данных #frontend_разработка #валидация_форм #developer_experience #валидация

🎬 Rich actions with confirmation dialogs, onSuccess & onError callbacks
👁️ Conditional visibility based on data, auth, or complex logic
📦 Two packages: @.json-render/core (types, schemas) + @.json-render/react (renderer, hooks)

🔧 Schema definition with #Zod for type-safe component props
📤 Export as standalone #React code with no runtime dependencies

https://github.com/vercel-labs/json-render

Хроники Valibot: как мы искали безупречные данные в мире JavaScript

Если вы когда-нибудь писали фронтенд на TypeScript и получали в проде Cannot read property 'x' of undefined , — добро пожаловать в клуб! TypeScript спасает нас от сотен ошибок… но только пока код не запущен. Как только он скомпилировался, типы исчезают, и в рантайме вы снова остаетесь один на один с невалидными данными. И вот тут начинается: меняется API, формы шлют что угодно, аналитика ломает отчёты, а тесты молчат. В Островке мы попробовали библиотеку Valibot — легковесный runtime-валидатор, который умеет проверять данные на границах контекстов и при этом остаётся дружелюбным к TypeScript . Под катом рассказываем, почему статической типизации уже недостаточно, чем Valibot отличается от Zod, и как валидатор помогает нам строить более надёжную архитектуру без лишнего кода.

https://habr.com/ru/companies/ostrovok/articles/987380/

#valibot #zod #architecture #forms #js #валидация_данных #runtime #формы #api #типобезопасность

Zod + TypeScript: Schema Validation Made Easy

https://fed.brid.gy/r/https://frontendmasters.com/blog/zod-typescript-schema-validation-made-easy/

Random Old Comic: Feel https://www.toyboxcomix.com/2018/02/01/feel/ Feel #DC #DorothyZbornak #Finn #PoeDameron #StarWars #Zod

✅ Summary: No More Black Box

Vercel AI SDK smoothes over the differences between OpenAI (JSON Mode) and Anthropic (Tool Calling).
Write Zod once, run anywhere.

Next: **1.5 Agents & Tools**.
Giving AI hands and legs. Unveiling the tool calling mechanism behind Agents. 🚀

#BibiGPT #Vercel #AI #Zod #FullStack

✅ 总结：不再是黑盒，而是标准 API

Vercel AI SDK 抹平了 OpenAI (JSON Mode) 和 Anthropic (Tool Calling) 的底层差异。
你只需要写一次 Zod，就能运行在任何模型上。

下节课：**1.5 Agents & Tools**。
给 AI 装上四肢，揭秘智能体背后的工具调用。🚀

#BibiGPT #Vercel #AI #Zod #FullStack

J'applique systématiquement la même logique avec Zod mais dans `src/config.ts`. Ça permet d'éviter de nombreux problèmes au runtime.

Pour éviter les appels à `process.env`, il est possible d'utiliser la règle ESLint `n/no-process-env` et d'ajouter une exception pour le seul fichier `src/config.ts`.

🔗 https://tsev.dev/posts/2025-12-03-safe-environment-variables-in-javascript/

#environnement #validation #Zod #NodeJS #eslint

Optique 0.7.0: Smarter error messages and validation library integrations

https://hackers.pub/@hongminhee/2025/optique-070

Un standard pour les lib de validation TypeScript (Zod, Valibot, etc.).

L'objectif est d'avoir une spec standardisée pour que les outils interagissant avec ces schémas fonctionnent quel que soit la lib de validation choisie. Un peu comme les PSR rn PHP.

Vitest supporte d'ailleurs ce format depuis la v4, pour rendre certaines assertions plus faciles à écrire.

🔗 https://standardschema.dev/

#Zod #validation #Vitest #standards #schema

Структура против хаоса — практическая валидация форм с помощью Zod

Всем привет, с вами Артем Леванов, Front Lead в компании WebRise. В прошлой статье мы разобрали, как навести порядок в создании форм — выделили примитивы, ячейки и типовые поля. Следующая проблема, с которой сталкивается любая форма — валидация . Формы могут быть красивыми и структурными, но без единого подхода к валидации они быстро превращаются в хаос. В этой статье поговорим о том, почему встроенные и кастомные проверки плохо масштабируются, особенно в динамических формах, и как Zod решает эту проблему, превращая валидацию в декларативную и типобезопасную систему.

https://habr.com/ru/articles/967540/

#reactjs #react #zod #валидация #валидация_форм #typescript #javascript #валидация_htmlформ

Random Old Comic: Steal https://www.toyboxcomix.com/2018/03/19/steal/ Steal #Batman #BlancheDevereaux #Buzzer #CobraCommander #DC #GIJoe #GoldenGirls #Lockjaw #Marvel #Ripper #Robin #Torch #Zod

Un retour d'expérience intéressant sur la transformation d'une architecture bancale et ambiguë en architecture plus simple et pragmatique.

🔗 https://marmelab.com/blog/2025/10/29/from-graphql-to-zod.html

#GraphQL #REST #Zod #NodeJS

A few months ago I published a #rust crate that generates #typescript and #zod boilerplate from #tauri commands. I never thought anyone else would use it and opened my repo to see two pull requests and a few issues added to the tracker. There's obviously a few gaps due to messy development but it gets the job done.

https://github.com/thwbh/tauri-typegen

Random Old Comic: Meal https://www.toyboxcomix.com/2018/02/27/meal/ Meal #BlancheDevereaux #Buzzer #DC #GIJoe #GoldenGirls #Ripper #SophiaPetrillo #Torch #Zod

Comment utiliser Zod en pratique pour valider les variables d'environnement, les configurations, les *payloads* reçues de vos utilisateurs, etc.

🔗 https://flaviocopes.com/zod/

#Zod #validation #TypeScript

Today, I am Harold 🤦‍♂️

Me: Trying to autocomplete a simple React useState with pure JavaScript undefined.

IntelliJ: Knows better and imports undefined from Zod.

#React #JavaScript #Zod #IntelliJ #IDEproblems #Validation #Harold

Super.Human.Portal rewrite nearly complete 🚀 We cut ~80% of our code thanks to an amazing stack: TanStack Router, TanStack Query, TailwindCSS, shadcn components, DevExtreme, & zod. Couldn’t love these libraries more ❤️

#superhumanportal #DominoForever #tanstack #tailwindcss #shadcn #zod, #devextreme

Zod-valid. Безопасная валидация API данных

Zod-valid — это Typescript библиотека, зависимая от другой известной библиотеки zod , для безопасной валидации API данных. API редко гарантирует идеальные данные: поля могут быть пропущены, типы не совпадать, структуры меняться. Без проверки этих данных приложение рискует вызвать runtime-ошибки или ломать бизнес-логику. Валидировать данные заранее — значит обеспечить предсказуемое поведение и защитить приложение от неожиданных значений.

https://habr.com/ru/articles/947252/

#typescript #zod #валидация_данных #валидация #api

First day in Mastodon after coming from Twitter vs One week later

#TerenceStamp #zod #priscilla