itihon May 13 at 15:52

Isomorphic-validation — Javascript библиотека, облегчающая валидацию пользовательского ввода

Medium

7 min

1.4K

Website development*JavaScript*Functional Programming*

Comments 5

eimrine May 13 at 21:00

Я немножко не настоящий джаваскриптер, но слово изоморфизм имеет отношение к одному моему проекту. Грубо говоря, 2 массива или множества a и b - изоморфны, если у них одинаковое количество элементов и существует способ установить какие-то отношения между каждым a[i] и b[i]. Так вот, почему вы поставили в заголовок это слово, но не обосновали его? Мне бы хотелось только увидеть в вашем творении изоморфизм, вопросы валидации и остального мне не важны.

itihon May 14 at 09:16

Словом 'isomorphic' в названии библиотеки я хотел подчеркнуть то, что использовать одни и те же валидации можно на клиенте и на сервере. Пишем код валидации один раз, и этот код используется и там и там одинаково.

Наверное, такой термин, как "изоморфный Javascript" уже не используется.

Из Википедии, свободной энциклопедии
Не путать с изоморфизмом.
Изоморфный JavaScript, также известный как универсальный JavaScript, описывает приложения JavaScript, которые работают как на клиенте, так и на сервере.

Выбрать название оказалось не так то просто. Все более менее лаконичные названия, которые приходили мне в голову, оказались либо заняты на NPM либо были названиями компаний, работающих в сфере аккредитации, сертификации и т.д. Я остановился на этом. А позже, когда публиковал очередную версию библиотеки, оказалось, что точно с таким же названием тоже существовал когда-то проект. Но менять название я уже не стал. Так что, что имеем, то имеем.

Sayyat May 14 at 08:35

Я активно пишу на Next js. Поэтому предпочитаю zod в паре с react-hook-forms. Я построил удобную интеграцию zod с i18n, чтобы он сразу вернул ошибки в нужном языке. А RHF позаботится с вставлением zod ошибок в нужные поля.

isumix May 14 at 09:05

Подскажите, как декларативно (также как в 1 примере), можно проверить 2 поля пароля на равенство (form.password === form.password2) ?

itihon May 14 at 10:14

Например, вот так:

Скрытый текст

form.addEventListener(
  'input',
  Validation.group(
    // здесь могут быть валидации других полей
    // и/или группы валидаций
    // ...

    Validation.glue(
      Validation(form.password),
      Validation(form.password2),
    )
    .constraint((val1, val2) => val1 === val2)
    .validated(applyOutline(form.password))
    .validated(applyOutline(form.password2))
  )
);

Здесь обводка вокруг каждого поля отражает состояние валидности "склеенной" группы.

Состояние валидности группы зависит от каждой валидации в группе. Группа может содержать другие группы.

А еще вот сдесь есть пример валидации паролей, со схемой, поясняющей работу.

Вот тут еще один пример с паролями.

А еще вот здесь пример формы входа и формы регистрации с видео объяснением.

Вся докоментация пока только на англ.языке.