Форма в Next.js начинает ломаться не на кнопке submit. Кнопка как раз чаще всего работает. Проблемы появляются позже, когда становится непонятно, где поле должно показать ошибку, когда блокировать отправку, что считать общей ошибкой формы, а что ошибкой конкретного input.

Поэтому полезно смотреть на форму не как на набор полей, а как на контракт. У неё должны быть понятные состояния pending, disable, success, fieldErrors и formError. Тогда submit становится только частью общей схемы, а не единственным событием, вокруг которого держится весь UI.

Здесь хорошо работает связка Zod, safeParse и flatten. safeParse возвращает управляемый результат без исключений, а flatten помогает привести ошибки к форме, удобной для интерфейса. В итоге и client, и server могут жить по одним и тем же правилам, а сама форма перестаёт быть местом случайных договорённостей.

Статья на Хабр Проект: Workbench Stepik: Next.js II: TypeScript 2026

#nextjs #typescript #zod #forms #validation #approuter #react #вебразработка