Zod: валидация Nestjs и контракты для React

Посмотрим, как можно использовать Zod в связке с Nestjs для валидации данных и использовать полученные типы как контракты для React приложения.
🔗 Ссылки:
🎓 Мои курсы по разработке: purpleschool.ru
💬 Telegram канал с полезными советами:
t.me/purple_code_channel
Разделы видео:
0:00 - Введение
0:16 - Почему Zod
1:14 - Подготовка проекта
3:12 - Описание контрактов
8:15 - Валидация backend
11:57 - Тест запросов
13:27 - Контракты для frontend
16:44 - Заключение

Пікірлер: 64

  • @PurpleSchool
    @PurpleSchool9 ай бұрын

    🔗 Ссылки: 🎓 Мои курсы по разработке: purpleschool.ru 💬 Telegram канал с полезными советами: t.me/purple_code_channel

  • @yatolstoy
    @yatolstoy9 ай бұрын

    Антон, какая ж это красота! Крутое решение. Определённо буду использовать его в проектах. Большое спасибо за видео)))

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Спасибо!

  • @nickolaizein7465
    @nickolaizein74658 ай бұрын

    всегда интересные и качественные видео!! Спасибо большое!

  • @PurpleSchool

    @PurpleSchool

    8 ай бұрын

    Пожалуйста!

  • @bekanur98
    @bekanur987 ай бұрын

    Почему я не видел этот канал раньше. Очень хороший контент!

  • @PurpleSchool

    @PurpleSchool

    7 ай бұрын

    Спасибо!

  • @user-fk9ju6pn3v
    @user-fk9ju6pn3v9 ай бұрын

    Спасибо, видео просто огонь 🔥 А ответ от сервера тоже проходит валидацию через zod?

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    В данном примере нет, но можно сделать. Хотя при строгой типизации на беке это будет излишне

  • @MrSlapp150
    @MrSlapp1508 ай бұрын

    Очень полезное видео!!! http запросы через какое расширение делаешь?

  • @PurpleSchool

    @PurpleSchool

    8 ай бұрын

    Через httpie

  • @froncast
    @froncast9 ай бұрын

    Спасибо за видео! Как по мне, так это хорошая замена библиотеке class-validator Но, на бэке для респонса использую Automapper. Что на счет его использования вместе с zod? Или может быть есть какая-то хорошая альтернатива автомапперу?

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Спасибо! Вместе с автомаппером не использовал

  • @user-mi6fo5hp2y
    @user-mi6fo5hp2y8 ай бұрын

    Спасибо за видео! Я еще видел вариант, когда берут какую-то спецификацию swagger/graphql и из нее кодгеном делают полноценную sdk для работы с бекендом И тоже хранят в npm для удобного доступа. Что думаете о таком способе?

  • @PurpleSchool

    @PurpleSchool

    8 ай бұрын

    Вполне тоже вариант рабочий

  • @romandeveloper7720
    @romandeveloper77209 ай бұрын

    круто) покажи еще, плиз, генерацию опен-апи спеки и генерацию фетчеров для клиента и было бы круто еще к этому премеру зод подключить, чтобы показать, как оно всё вместе) но раз там будет сваггер, то нет смысла контракты генерить по зоду, по спеке же будет всё генериться, да?

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Про наличии контрактов не нужно городить отдельно Open API

  • @romandeveloper7720

    @romandeveloper7720

    9 ай бұрын

    @@PurpleSchool ну а как же спека

  • @romandeveloper7720

    @romandeveloper7720

    9 ай бұрын

    @@PurpleSchool или спеку тоже можно генерить?

  • @Dima-yw5kj
    @Dima-yw5kjАй бұрын

    стоит ли сейчас использовать nestjs-zod? Я прочитал что автор написал о том что пакет больше не поддерживается им

  • @AlexanderSavchenko91
    @AlexanderSavchenko91Ай бұрын

    публиковать контракты в нпм конечно круто но можно глянуть в сторону git subtree

  • @PurpleSchool

    @PurpleSchool

    Ай бұрын

    Да, тоже вариант

  • @bekanur98
    @bekanur986 ай бұрын

    Можно показать пример, как использовать ZOD для get запросов а именно с query params. Загвоздка в том, что все гет параметры считаются как string, в этом случае boolean и number не пройдут валидацию через zod. Спасибо заранее

  • @PurpleSchool

    @PurpleSchool

    6 ай бұрын

    В рамках Zod можно задать трансформацию при получении, а затем валидацию

  • @ilsrbn
    @ilsrbn8 ай бұрын

    Класс. Плавно подошли к монорепам?)

  • @PurpleSchool

    @PurpleSchool

    8 ай бұрын

    Тоже рассмотрим)

  • @alexandersergeev4500
    @alexandersergeev45009 ай бұрын

    Антон, как ты добился такого вида статус бара в tmux?, визуально выглядит как nvchad. Я о нижней строке, это же tmux? И когда уже будет обзор на nvchad?)

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Да, это он. У меня на канале есть видео его настройки. Nvchad будет следующим

  • @alexandersergeev4500

    @alexandersergeev4500

    9 ай бұрын

    @@PurpleSchool видео по tmux смотрел, просто интересно как сделал такой красивый статус бар в tmux, что он выглядит как статус бар nvchad-а))

  • @user-zi4gy8nk6d
    @user-zi4gy8nk6d9 ай бұрын

    я сейчас с проблемой столкнулся, для запуска frontend я использую vercel, он бесплатный и сильно упрощает запуск приложения. Но nestjs приложение там запускать нельзя или по крайне мере оно будет ограничено. Ктонибудб знает что можно использовать для такого же простого и удобного запуска nestjs как vercel?

  • @cob41n

    @cob41n

    9 ай бұрын

    railway

  • @aleksandrpetrov3938
    @aleksandrpetrov39385 ай бұрын

    nestjs-zod в документации предлагают создавать схемы при помощи модифицированной версии zod'a и импортироваться из nestjs-zod/z. Я могу такую схему юзать на фронте тоже? Чем они отличаются? Просто добавлением дополнительных методов к уже имеющимся?

  • @PurpleSchool

    @PurpleSchool

    5 ай бұрын

    Чтобы использовать на фронте надо будет туда её и тянуть, а это не очень хорошее решение

  • @user-zg2vu3er7r
    @user-zg2vu3er7r8 ай бұрын

    Антон, добрый день! С интересом посмотрел видео. Пытаюсь накинуть в свой проект. Все замечательно работает: и входные данные валидируются и выходные парсятся в необходимый тип (теперь в ORM Prisma не надо заморачиваться с тем, какие поля вытаскивать в селект и т. ). Но возникли трудности с парсингом для полей типа Prisma.Decimal. Можете подсказать элегантное решение?

  • @PurpleSchool

    @PurpleSchool

    8 ай бұрын

    Мне кажется типы Prisma не надо использовать в dto

  • @romandeveloper7720
    @romandeveloper77209 ай бұрын

    оо, так это ж получается, что эти валидации теперь и в формочки можно подсовывать? чтобы бек лишний раз не дергать за ошибками, а на клиенте уже их светить

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    конечно

  • @CJIu3eHb
    @CJIu3eHb9 ай бұрын

    По-моему, пропущена история подключения контрактов к nestjs внутри этого "монорепо".

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Там нет подключения, ты просто ссылаешь на контракт, так как по сути это не монорепа

  • @CJIu3eHb

    @CJIu3eHb

    9 ай бұрын

    @@PurpleSchool добавлено в зависимости а-ля "bar": "file:///home/user/src/foo/bar"?

  • @dominicpowers5938
    @dominicpowers59389 ай бұрын

    А где можно скачать твой конфиг консоли и vim?

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Будет разбор и ссылка в следующем видео

  • @user-fi9tn1pr4m
    @user-fi9tn1pr4m9 ай бұрын

    Подскажи это Codeium делает подсказки?

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Да, он самый

  • @user-fi9tn1pr4m

    @user-fi9tn1pr4m

    9 ай бұрын

    @@PurpleSchool круто, тоже его использую удобен для nvim, да и продуктивность в пару раз поднимает так точно на каких-то базовых вещах

  • @DmitryDevWeb
    @DmitryDevWeb9 ай бұрын

    Npm пакет получился публичным, возможно сделать приватным, но на уровне компании этим удобно пользоваться?

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Можно, но нужно будет или npm платить 7$ за пользователя или делать свой приватный регистри.

  • @DmitryDevWeb

    @DmitryDevWeb

    9 ай бұрын

    @@PurpleSchool , понял, спасибо

  • @polioann
    @polioann9 ай бұрын

    Помню падал бек из-за NaN значения в zod😢

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Ого, не ловил такое

  • @gangnusvi
    @gangnusvi9 ай бұрын

    Только получается типы всегда не строгие? Например этот UserLoginResponse содержит accessToken?: string;

  • @user-re7zb6oo2s

    @user-re7zb6oo2s

    9 ай бұрын

    я тоже этого момента не понял. Щас пытаюсь переписать и у меня все типы не строгие, а призма требует строгие...

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Нет, в типах он type UserLoginResponse = { accessToken: string; }

  • @user-re7zb6oo2s

    @user-re7zb6oo2s

    9 ай бұрын

    под капотом оно делает не строгие типы. Я пытаюсь передать дто в сервис, в котором тип призмы и поле там строгое, не получается. Он жалуется, что некоторые поля опциональные@@PurpleSchool

  • @biLLie_wiLLie
    @biLLie_wiLLie9 ай бұрын

    В этом видео так много Z, что можно случайно попасть в политическую партию)

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    🤣

  • @user-su5jx8od6z

    @user-su5jx8od6z

    9 ай бұрын

    В психбольницу

  • @moon.trance
    @moon.trance8 ай бұрын

    Если собрать все в монорепо, то не придется ничего никуда паблишить, ну и валидацию хочется делать как на фронте, так и на бэке. Ждем пока Камиль догадается подкинуть zod из коробки вместо отвратительного class-validator.

  • @PurpleSchool

    @PurpleSchool

    8 ай бұрын

    Пока нет на это намёков)

  • @dimovich85
    @dimovich859 ай бұрын

    Все через z, ясно, вполне привычно

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Так уж библиотека устроена

  • @asktosimon
    @asktosimon9 ай бұрын

    не могу понять как ютуб работает) 23 коментария всего но отображается 8

  • @PurpleSchool

    @PurpleSchool

    9 ай бұрын

    Тестировщиков на них нет)