Типизация для Redux Toolkit
ฝัง
- เผยแพร่เมื่อ 3 พ.ค. 2022
- TypeScript для Redux Toolkit - как повышение надежности React-приложения. RTK и React-Redux написаны на TypeScript, а официальная документация дает нам отличные примеры лучших практик для использования в собственных приложениях.
Ссылки из видео:
Код из видео github.com/michey85/rtk-ts
Оригинальный проект github.com/michey85/redux-too...
Мои курсы по вебу с купонами:
✅ mishanep.com/
📢 Поддержка канала:
/ mishanep
www.tinkoff.ru/rm/nepomnyasch...
paypal.me/mishanep
Качественный контент, которого так не хватает. Спасибо за проделанную работу!
Контент по заявкам подъехал)) Спасибо, Михаил! Отлично!
Спасибо. Коротко и всё по теме, то что нужно!
Спасибо за видео! Очень жду материал по типизации AsyncThunk
Спасибо. Качество контента как всегда на высоте.
Большое спасибо за ваши уроки!
Очень понятно и структурированно объясняете, очень приятно у вас учиться!
спасибо за подачу и нужный материал! желаю развития вашему каналу!
Спасибо. Вы лучший!!!
Ждём следующего видео.
Спасибо за контент по тайпскрипту, как раз начал на нем писать. Хотелось бы ещё увидеть типизацию AsyncThunk и библиотеку axios.
у axios типизация из коробки
Лучший ру контент по js и прочим ! Очень круто объясняете ! Спасибо
Очень достойный контент, благодарю от всей души за такую работу
Вся Благодарность в Мире адресована вам))
почему то мне очень заходит ваше объяснения. Большое при большое человеческое спасибо.
Спасибо , информативно. Было бы интересно ещё увидеть добавление asyncThunk, EntityAdapter, rtk Query - с тайпскриптом конечно)
Спасибо! Очень круто объясняешь! Удачи!
Отличный контент! Автору спасибо!
Как же ты вовремя поднял эту тему, только начал ts учить. Нужно больше ts
Спасибо за видео! как раз учу ТС) и тут такое...) Спасибо!
Спасибо! Супер контент, аналогов почти нет. Недавно начала смотреть ваши видео, очень нравится!
Спасибо, Михаил, очень нужное видео, сильно помогло
Круто!!! Когда прям указываешь на сколько важна типизация и как именно она помогает!!! После слов:вот здесь мы не ошибёмся никогда, имелось ввиду автодополнение. Прям по-другому посмотрел на Typescript.
Очень в кассу. Полезно про типизацию
Спасибо, Михаил, за материал! Очень хорошая подача, доступно объясняешь.
Честно говоря когда я слушаю большинство программистов, которые что то объясняют, удивляюсь почему они говорят так сложно, ведь все тоже самое можно сказать проще не теряя в смысле. Михаилу спасибо большое.
Прям, в точку Михаил. После просмотров некоторых неудачных видосов у других людей, когда мозг сначала закипает а потом => засыпает.
Только искал контент про типизацию тулкитов, Спасибо!
Спасибо за очередное полезное видео
Большое спасибо! отличное видео!
Отличный урок, большое спасибо
Спасибо! Жду видео про RTK query, тоже с типизацией)
Огонь, спасибо! Мне как нельзя кстати)
Очень недооцененный канал. Всё толково, всё по делу.
Спасибо Михаил!
Спасибо отличный контент делайте
Отличное видео! спасибо!
Ты лучший! Спасибо!
От души Миша!!! Спасибо.
Большое спасибо👍👍👍👍👍👍👍👍👍
Даражэнькі Міхаіл, дзякуй вам вялікі за такі цудоўны кантэнт! праз вашы відэа я ў большасці зразумела redux toolkit! 💋💋💋
на русском пиши
@@user-th4qi8iv3q навошта?
@@user-th4qi8iv3q тоді краще на енгліш
ochen kruta spasibo
Спасибо! (Типизация для Redux Toolkit)
классное видео, ждем createAsynkThunk!
тупа подарок
В интерфейсе на 17:30 для updateText указал тип React.Dispatch вместо (str: string) => void, и работает также без ошибок
У Вас есть видео про переезд на RTK 2, но там Вы рассматриваете только js, можете рассказать, что меняется в контексте ts?
А можно создание селекторов вынести в отдельный файл, чтобы наши компоненты ничего не знали про устройство стейта и тогда можно писать const todos = useSelector(selectTodos); Не создавая дополнительного хука
Да, конечно можно в отдельном файле, но лучше с дополнительным хуком))
Михаил, подскажите, пожал., открытую API для получения названий и описаний статей на 100 символов, а при открытии - полная статья 😇 Очень нужно для тестового!
Михаил, я заметила, что иногда для типизации объектов вы используете type, а иногда interface. Есть ли какое-то правило когда что использовать. Например, пропсы типизируем через interface, а, скажем, обьект с данными о пользователе через type. Тот же стейт вы типизируете через type, но я часто встречаю, что это делают через interface. Или это не суть важно?
По факту это вопрос предпочтений. Когда нужно объединять несколько объектных типов, многим нравятся интерфейсы. Но того же можно добиться и с алиасами типов. Разница будет если писать интерфейсы для классов. Но если ими не пользоваться, можно обойтись одними алиасами типов.
@@mishanep Спасибо, Михаил, что всегда отвечаете на вопросы. Это очень ценно)
Здраствуите у меня хуки appDispatch , appSelector реакт говорить нельзя использовать на верхнем уровне нужно или на реакт компоненте вызывать или на кастом хук функции
Все все решил я просто забыл в функцию обернуть юздиспатч спасибо за видео
Как Вы определяете, в каких случаях тип надо задавать через Type, а в каких через Interface?
В большинстве случае определяет style guide на проекте =)
По большому счету, если вы не пишете библиотеку общего пользования и не используете интерфейсы для типизации классов, можно всегда обходиться алиасами.
Привет! Если хочу в Акшон передать объект что в место стринга писать?
Тип объекта
Очень правильно посреди настройки бросить её и начать писать кастомные хуки. (нет)
Спасибо за интересное видео! Однако не совсем понятно, зачем при создании store нужно изобретать велосипед, когда разработчики rtk уже все сделали за нас: 1. Можно стартануть проект с шаблоном ts. 2. Можно зайти в соответствующий раздел официальной доки и скопипастить.
Так разве в видео был велосипед? В официальной доке предлагается такой же подход. Я ничего не придумывал в этом отношении. А само видео больше направлено на то, чтобы разобраться что зачем. В дальнейшем можно и копипасть при желании, но всегда лучше делать с пониманием что есть что.
@@mishanep Я о том, что типизация стора в rtk идёт из коробки. Можно было это показать, а не писать руками, чтобы у новичков не создавалось ощущения, что разработчики rtk опять усложняют свой продукт )
Что значит из коробки? Если речь про готовые темплейты, которые можно ставить с create-react-app, то это не всегда актуально. Редакс часто добавляется в уже существующий проект по хожу жизненного цикла. Да и не каждый проект в принципе через эту утилиту создается.
Мысли читаете))
Это всегда так было или это новый способ?
О чем конкретно вопрос-то?)
+++
Ага типизируешь useDispatch, а в его использовании он всеравно остается any. Какой тогда смысл, кроме того, что код чуть читаемее становится? 1.5 часа голову ломал, как протипизировать его, а на деле оказывается все это так используют
Почему в новой документации RTK нет никакой абсолютно информации про хук useAppSelector ? А в старой есть!! То есть они оставили useAppDispatch, а инфу про useAppSelector выпилили.
Это почему так произошло?
Какое же говно непонятное все эти документации.
В новой документации Redux Toolkit есть информация о другом хуке, который заменяет `useAppSelector`. Это новый хук `useSelector` из библиотеки `@reduxjs/toolkit`.
В старых версиях Redux Toolkit, хук `useSelector` принадлежал пакету `react-redux` и требовал явного указания типа состояния (`RootState`). Однако, начиная с версии 7.1.0 Redux Toolkit, этот хук был включен непосредственно в саму библиотеку Redux Toolkit и новая документация больше не упоминает `useAppSelector`.
Теперь, вместо `useAppSelector`, использование рекомендуется просто вызывать `useSelector` из `@reduxjs/toolkit`, так как он автоматически будет знать о типе состояния. Необходимость в типизации (`TypedUseSelectorHook`) уже встроена в новый `useSelector`.
В итоге, если вы используете новую версию Redux Toolkit, можно просто использовать `useSelector` без необходимости в явном указании типа состояния.
@@trendsgallery Что за бред? Это Чат ГТП высрал?
ГОЙДА!
Спасибо за видео! У меня возникла ошибка The above error occurred in the component:
at Provider (localhost:3000/static/js/bundle.js:3918:5)
Consider adding an error boundary to your tree to customize error handling behavior.
Cannot read properties of null (reading 'useMemo')
at useMemo (react.development.js:1650:1)
at Provider (Provider.js:12:1)
Возможно не та версия react-redux Помогите пж