Почему я не использую хук useReducer? | React Hooks

  Рет қаралды 4,108

Ayub Begimkulov

Ayub Begimkulov

Күн бұрын

В данном видео мы поговорим про такой хук, как useReducer. Расскажу про его особенности, для чего он задумывался, и почему я никогда его не использую (и что использую вместо него).
Ссылка на код из видео:
github.com/Ayub-Begimkulov/yo...
Видео про хук useEvent:
• САМЫЙ ПОЛЕЗНЫЙ хук для...
Telegram канал:
telegram.me/ayub_begimkulov_c...
Таймкоды:
00:00-00:23 - Интро
00:23-01:23 - Когда нужен useReducer?
01:23-03:01 - Сравнение useState и useReducer - первый пример
03:01-09:43 - Сравнение useState и useReducer - второй пример
09:43-13:15 - Плюсы и минусы каждого из хуков
13:15-16:41 - Проблемы с TypeScript у useReducer
16:41-19:24 - useMethods смотрим API
19:24-26:14 - Пишем useMethods
26:14-30:02 - Типизация useMethods
30:02-30:26 - Заключение

Пікірлер: 37
@user-dw8lb8lc7u
@user-dw8lb8lc7u Жыл бұрын
Аюб, ты освящаешь очень много жизненных проблем в React, формат мне очень нравится, продолжай!!!
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Спасибо за фидбэк!
@deantek
@deantek Жыл бұрын
на моей памяти использовал useReducer раза 2 за 2 года работы, очень понравилось видео, спасибо
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
спасибо за фидбэк!
@2difficult2do
@2difficult2do Жыл бұрын
Лайк, посмотрел, хорошее и подробное разъяснение. 👍
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Спасибо за фидбэк!
@dr.livesey5157
@dr.livesey5157 Жыл бұрын
Лучший
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Спасибо!
@harrisonwinston2850
@harrisonwinston2850 Жыл бұрын
Привет, хотел бы от тебя увидеть видео про веб-сокеты, тема не особо популярная, но лично мне интересна. Спасибо.
@nafanya3733
@nafanya3733 Жыл бұрын
спасибо большое, очень полезную инфу освещаешь)
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Рад помочь!
@artyomtaranenko2267
@artyomtaranenko2267 Жыл бұрын
Было бы не плохо рассказать фишки (как было в одном твоём видосе про собес), где и как правильно юзать мемоизацию. Я, честно сказать, сам порой теряюсь где надо и нет, поэтому сначала пишу код без неё, если где-то прям очевидно вылазит, то добавляю
@user-kj6go4ft4j
@user-kj6go4ft4j Жыл бұрын
Полный вперёд! 🎉
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Спасибо!
@serious_psychologist
@serious_psychologist Жыл бұрын
тема интересная ) но как же ты разгоняешься именно в разговоре, про пример undo/redo рассказывал с нормальной скоростью, потом к useReducer перешел и тра татататата ) как автомат. прикольно выглядит просто.Не в укор, понимаю что информации много и хочется уложить в минимальное время. просто особенность заметил ;) инфа полезная очень, спасибо.
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
хахаха, да, есть такое.
@mercury_2379
@mercury_2379 Жыл бұрын
комментарий в поддержку канала
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Спасибо!
@magnific8930
@magnific8930 Жыл бұрын
👍👍👍
@jamjam3337
@jamjam3337 Жыл бұрын
👏👍
@user-dw8lb8lc7u
@user-dw8lb8lc7u Жыл бұрын
очень часто встречаюсь с проблемами из видео было очень интересно посмотреть как useReducer/useMethods их решает ( я в таких случаях просто использовал стейт менеджер(mobx) но если состояние с которым мы хотим работать локальное(каждый инстанс этого компонента имеет свой личный стейт) приходится использовать костыльный хук который создаёт инстанс mobx-стора при маунте компонента такой костыль я мог позволить себе поскольку я был 1 в команде и у меня был mobx сейчас когда у меня редакс и команда перед которой надо объяснять каждый костыль альтернативные способы становятся ещё актуальнее... )
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Ну, если в проект везде mobx, то можно и к такому решению прийти. Главное, чтобы везде консистентность была.
@malsagov6331
@malsagov6331 Жыл бұрын
👍👍👍👍
@user-ny2mr7jh9i
@user-ny2mr7jh9i Жыл бұрын
мб расскажешь про нюансы и случаи использования useEffect, а то в новой доке реакта рекомендуют не злоупотреблять этим хуком
@oWeRQ666
@oWeRQ666 Жыл бұрын
14:06 как получить такие комментарии с выводом типа?
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
vscode-twoslash-queries
@romandeveloper7720
@romandeveloper7720 Жыл бұрын
Не совсем понял, как можно useEvent'ом решить проблему во втором примере? Можешь показать, пожалуйста?
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Просто завернуть колбэк в хук useEvent, и все) Я подробнее о нем рассказываю в отдельном видео - можешь посмотреть.
@romandeveloper7720
@romandeveloper7720 Жыл бұрын
@@ayub_begimkulov , ах, точно, тупанул)
@albertrain7093
@albertrain7093 Жыл бұрын
я узнал что-то новое. я не знаю реакт )))
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Вех живи - век учись!
@oWeRQ666
@oWeRQ666 Жыл бұрын
Пример с undo как-то слишком притянут за уши, если состояние нельзя описать одним значением - значит надо их объединить и хранить в одном стейте, и уже это решение сравнивать с редьюсером, вообще добавление редьюсера в ядро реакта вызывает вопросы, можно же и через стейт использовать редьюсер dispatch = action => setState(state => reducer(state, action))
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
Хммм, а как ты считаешь надо это все писать? Да, хук useReducer - заменяем, я как-то писал про это пост в ТГ. Но у него по мимо объединения стейта есть и другая фича - это то, что сам редьюсер не надо мемоизировать и dispatch имеет всегда одну и ту же ссылку. Уже с такими условиями его реализовать было бы чуть сложнее, чем ты показываешь) Касательно сравнения тоже не согласен, никто не пишет несколько стейтов в один объект просто так. Обычно если так и делают, то только из-за неудобство хука useReducer.
@oWeRQ666
@oWeRQ666 Жыл бұрын
​@@ayub_begimkulov обернуть dispatch в useCallback, редьюсер - чистая функция, не вижу ни одной причины ее заносить в компонент, опять же это решаемо и всегда можно сделать кастомный хук, вопрос в том нафига это в ядре, где код хуков мягко говоря запутанный, имхо, в ядре должны быть только базовые.
@user-wn7pq9jj5p
@user-wn7pq9jj5p Жыл бұрын
не могу понять, зачем столько лепить useCallback() и useMemo()? Неужели они здесь оправданы?
@ayub_begimkulov
@ayub_begimkulov Жыл бұрын
А можешь раскрыть мысль? Где именно? Тут просто есть особенность в том, что большинство примеров в данном видео - переиспользуемые хуки. И ты не знаешь, где они будут использоваться. Поэтому нужно все мемоизировать.
Жайдарман | Туған күн 2024 | Алматы
2:22:55
Jaidarman OFFICIAL / JCI
Рет қаралды 1,7 МЛН
DO YOU HAVE FRIENDS LIKE THIS?
00:17
dednahype
Рет қаралды 84 МЛН
БОЛЬШОЙ ПЕТУШОК #shorts
00:21
Паша Осадчий
Рет қаралды 9 МЛН
Чего ожидать от HTTP/3 + Go
51:07
Нина Пакшина
Рет қаралды 1,3 М.
Learn React Hooks: useReducer - Simply Explained!
13:48
Cosden Solutions
Рет қаралды 48 М.
ПОЛНОЦЕННЫЙ ГАЙД ПО REACT CONTEXT
35:45
Ayub Begimkulov
Рет қаралды 9 М.
ТОП 6 ОШИБОК ПРИ РАБОТЕ С Redux Toolkit
22:53
Ayub Begimkulov
Рет қаралды 12 М.
[Эксперимент] useContext + useReducer вместо Redux
7:39
АйТи Синяк
Рет қаралды 11 М.
#4: React Hooks - useMemo + React.memo
25:38
Archakov Blog
Рет қаралды 69 М.
Жайдарман | Туған күн 2024 | Алматы
2:22:55
Jaidarman OFFICIAL / JCI
Рет қаралды 1,7 МЛН