На 01:31:43 - Практика работы с селекторами ппц как поплыл , как будто бы по голове дали тяжелым предметом )) А вообще подача и материал огонь! Смотрю взахлёб)
Евгений, огромное тебе спасибо! Сейчас прохожу стажировку, и нужно было срочным образом выучить Redux))) Для меня пока немного сложновато, но тут наверное только практика поможет. Еще раз спасибо за твой титанический труд, пойду смотреть вторую часть!
2:51:39 На этот моменте ты проверяешь работает ли counter, но тут момент, когда нажимаешь на соседние (increment,decriment) то он не работает и в лог выдаёт ошибку "Uncaught TypeError: Cannot assign to read only property 'counter' of object '#'" Ругаясь на state[counterId].counter--; Код:.addCase(decrementAction, (state, action) => { const { counterId } = action.payload; if (!state[counterId]) { state[counterId] = initialCounterState; } state[counterId].counter--; });
я тут покапался чуток, ведь тоже наткнулся на эту проблему, и immer замораживает весь state, чтобы его в action никто не менял (а точнее уже в producers), это позволяет отлавливать ошибки, в общем безопасно, но с этим связана проблема, мы присваиваем ссылку на initial состояние, и в итоге он тоже заморозится, так как будет находится в замороженном state, и поэтому при повторном создании счетчика (когда соседние инкрементируешь/декрементируешь), то и получается ошибка: ты снова присваиваешь initialState и пока все нормально, но потом ты меняешь его значение - ++ или --, поэтому срабатывает ошибка, так как этот оббъект заморожен. И это прекрасно. Потому что без этого все бы работало, НО были бы глюки - так как ты работаешь с исходным initial объектом и меняешь в нем свойства, то соседние counters будут изначально иметь другое значение, а такого делать не нужно. Я бы вообще сделал бы функцию которая возвращает новый initial объект - таким образом можно не копировать, ведь если глубина объекта большая, то и деструктуризация не поможет
Евгений, простите меня, очень пушка! ТАк держать, огонь!!! Курс "Фундаментальный курс по Redux" является исключительным ресурсом для любого, кто хочет овладеть Redux. Курс хорошо структурирован: начиная с основ, он постепенно переходит к продвинутым концепциям. Преподаватель ясно объясняет материал и приводит практические примеры, делая сложные темы легкими для понимания. Практические проекты помогают закрепить знания и обеспечить их применение в реальных сценариях. Независимо от вашего уровня подготовки, этот курс является бесценным ресурсом для любого разработчика, стремящегося улучшить свои навыки в управлении состоянием с помощью Redux. Настоятельно рекомендую!
спасибо за информацию о правильном использовании селекторов. РТК на первый взгляд прост, но его надо уметь использовать правильно. Хорошо, что в доке РТК об этом упоминается. Надо просто сесть и вникнуть в материал. Увы, не все знают эти подводные камни. Многие на ютубе проходят лишь по верхам. Хорошо что автор рассказал об этих нюансах
Спасибо! Видео очень прикольное, а самое главное информативное. Очень понравлиось, когда объяснял как это работает под капотом и конечно живые примеры)
я смотрю в курсе все по офф гайду redux) для тех кто не хочет читать и изучать документацию) хотя там оч неплохо все объяснено. Ну и немного своего опыта добавлено.
блин рил годнота, пасиба за видосы Евгений, как я понимаю после просмотра этих видосов, можно покупать твои курсы уже посвященные архитектуре редакс, правильно понимаю?
Изучаю react и redux вместе с вами. Посмотрел сейчас 2 часа за 4 реальных часа)). Спасибо за труд! Не все понял в разделе 'работа с селекторами'. Можете кто-нибудь подсказать правильно ли я понял несколько моментов по useSelector? 1. Все селекторы вызываются каждый раз при обновлении любой части стора 2. При вызове селектора всегда происходит сравнение того что он возвращает (актуальные данные) с предыдущим состоянием этого же фрагмента данных в сторе по ссылке с помощью === 3. Если ссылки разные, то инициируется рендер компонента в котором используется данный селектор 4. Если изменить ссылку на данные в селекторе (например возвращать новый массив отсортированных юзеров) то старый и новый стейт будут всегда не равны, даже если в реальном сторе этот фрагмент данных не изменился. Это приводит к лишним рендерам компонента. 5. Если замутировать возвращаемый из селектора стейт: например поменять поле объекта, то рендера не будет т.к. ссылки все еще равны. И это anti-pattern
Спасибо за ваш труд! Скажите пожалуйста, я только начинаю смотреть видео, я не увидел в таймшортах про toolkit, хотя в заголовке видео он есть... Вы будете про него рассказывать?
Вам не кажется, что цикл скачиваний redux тупо замкнулся?)) Учат потому что больше всего скачиваний, а больше всего скачиваний, потому что много учеников?))) Спасибо за видео! Полностью согласен - redux нужно учить в первую очередь, хотя бы для того, чтобы потом больше никогда его не использовать в продакшен))
крч как я понял immer c прокси буквально копирует предыдущий стейт (или то, над чем работаем), делает в нём мутабельные изменения и засовывает этот объект как new state (но довольно оптимизированно)?
то что надо). Все видео про редакс тулкит на русском почти 2 годовой давности. Делал пет проект по уроку, пишу так же как и он но у меня не работает... оказывается уже так нельзя писать(((. Да и к тому же надоело скопировать код в точь точь не понимая что это и почему так пишется
Видос по редакс от Жени - это как поход к стоматологу. Давно знаешь, что надо сходить вылечить зуб (разобраться в редаксе), знаешь, что сам не справишься, тянешь до последнего, терпишь 3 часа, потом пол дня отходишь, но в итоге радуешься, что наконец-то можешь жевать (писать нормальный стор). А вообще я после попыток в редакс и доводов Жени в пользу зуштанд, пощупал послений и остался крайне доволен. Но с конъюнктурой рынка нужно считаться. С редаксом мы ещё надолго. Жене мешок лайков за бесценный контент. Мало такого. Пойду куда-нибудь резюме закину😂
В самом начале ввёл всё как на видео, useEffect с forceUpdate, ничего не работало. Чат gpt переделал код с useSelector, всё заработало. Почему бы сразу не делать правильный вариант, а то сперва какие то костыли, а useSelector разбирается потом
Это не костыли, а демонстрация того как работает react-redux "под капотом", и, видимо, вы ввели не все как на видео, потому что все работает с forceUpdate. useSelector это часть react-redux, это отдельная библиотека, а не "правильный вариант".
@@workshur Ну сравнивать стейт менеджер с библиотекой мягко говоря не корректно. К тому же jQuery он как РНР, его хоронят уже лет 15 и еще столько же минимум будут хоронить, но по факту на 8 из 10 сайтов он работает.
@@2Extremum а у тиктока несколько десятков млн посещений в день, так что довод бессмысленный. автор комментария утверждает, что говнокодный redux устарел концептуально
@@uvwzyx Вообще я писал о Redux Toolkit. А насчет "говнокода", так ругать каждый мастер, только никто пока не выкладывает свой "правильный" стейт менеджер. Я пробовал и Mobx и Zustand и Recoil, даже свой пробовал писать - неблагодарная задача и не факт что в ней можно найти идеальное решение. Потому знать эти инструменты в любом случае нужно. Особенно когда хочешь устроиться на хорошую зарплату.
Материал изложен очень подробно и доступным языком, качество картинки и звука - топ, благодарю за Ваш труд! 🎉
Лучшее что могло со мной произойти. Женя, видос - ТОП!
я еще не знаю, что там дальше по видео (просмотрела 10 минут), но как вы приятно рассказываете, слушать одно удовольствие)))
Хотелось бы еще разбор по асинхронным редюсерам. Спасибо за контент. 👍
Отличный разбор! Спасибо, Женя!
Ждем 2 часть про асинхронные запросы
Прикольно, когда открываешь канал, в закрепе видео "хватит учить redix", а на вкладке видео самое свежее это курс по redux)
На 01:31:43 - Практика работы с селекторами ппц как поплыл , как будто бы по голове дали тяжелым предметом ))
А вообще подача и материал огонь! Смотрю взахлёб)
Подача настолько огонь, что ты поплыл (я тоже поплыл к слову)
я только что дошел до этого момента, а что вы сделали, тут переход уже готовому коду
@@theempire392 я только что дошел до этого момента, а что вы сделали, тут переход уже готовому коду
Ну что за аттракцион невиданной щедрости! Спасибо!
Евгений, огромное тебе спасибо! Сейчас прохожу стажировку, и нужно было срочным образом выучить Redux))) Для меня пока немного сложновато, но тут наверное только практика поможет. Еще раз спасибо за твой титанический труд, пойду смотреть вторую часть!
почему на 1:49:36 идет перерендер юзеров, если мы работаем с counter?
2:51:39 На этот моменте ты проверяешь работает ли counter, но тут момент, когда нажимаешь на соседние (increment,decriment) то он не работает и в лог выдаёт ошибку "Uncaught TypeError: Cannot assign to read only property 'counter' of object '#'"
Ругаясь на state[counterId].counter--;
Код:.addCase(decrementAction, (state, action) => {
const { counterId } = action.payload;
if (!state[counterId]) {
state[counterId] = initialCounterState;
}
state[counterId].counter--;
});
решением будет создавать новый initialCounterState для каждого каунтера "state[counterId] = { ...initialCounterState}"
я тут покапался чуток, ведь тоже наткнулся на эту проблему, и immer замораживает весь state, чтобы его в action никто не менял (а точнее уже в producers), это позволяет отлавливать ошибки, в общем безопасно, но с этим связана проблема, мы присваиваем ссылку на initial состояние, и в итоге он тоже заморозится, так как будет находится в замороженном state, и поэтому при повторном создании счетчика (когда соседние инкрементируешь/декрементируешь), то и получается ошибка: ты снова присваиваешь initialState и пока все нормально, но потом ты меняешь его значение - ++ или --, поэтому срабатывает ошибка, так как этот оббъект заморожен. И это прекрасно. Потому что без этого все бы работало, НО были бы глюки - так как ты работаешь с исходным initial объектом и меняешь в нем свойства, то соседние counters будут изначально иметь другое значение, а такого делать не нужно. Я бы вообще сделал бы функцию которая возвращает новый initial объект - таким образом можно не копировать, ведь если глубина объекта большая, то и деструктуризация не поможет
Лучшее объяснение работы Redux. Благодарю!
Женя, большое спасибо за данное видео. Ты мне открыл глаза как работает иммутабельность.
Евгений, простите меня, очень пушка! ТАк держать, огонь!!!
Курс "Фундаментальный курс по Redux" является исключительным ресурсом для любого, кто хочет овладеть Redux. Курс хорошо структурирован: начиная с основ, он постепенно переходит к продвинутым концепциям. Преподаватель ясно объясняет материал и приводит практические примеры, делая сложные темы легкими для понимания. Практические проекты помогают закрепить знания и обеспечить их применение в реальных сценариях. Независимо от вашего уровня подготовки, этот курс является бесценным ресурсом для любого разработчика, стремящегося улучшить свои навыки в управлении состоянием с помощью Redux. Настоятельно рекомендую!
покури документацию redux и будет тебе щастье
спасибо за информацию о правильном использовании селекторов. РТК на первый взгляд прост, но его надо уметь использовать правильно. Хорошо, что в доке РТК об этом упоминается. Надо просто сесть и вникнуть в материал. Увы, не все знают эти подводные камни. Многие на ютубе проходят лишь по верхам. Хорошо что автор рассказал об этих нюансах
Спасибо! Видео очень прикольное, а самое главное информативное. Очень понравлиось, когда объяснял как это работает под капотом и конечно живые примеры)
Мужик, я реально обожаю тебя и твои видео, это золото просто
Великолепное обучающее видео. Большое спасибо, всего наилучшего автору!
Спасибо. Буду ждать 2ю часть 👍
я смотрю в курсе все по офф гайду redux) для тех кто не хочет читать и изучать документацию) хотя там оч неплохо все объяснено. Ну и немного своего опыта добавлено.
Для разделения видео на таймкоды вроде надо добавить в начале "00:00 Начало". Без этого тайм лайн не разделяется на сегменты в плеере
ты прав
Как же мне тебя не хватало эти полгода)))
1:02:14
как 2 переменные, в которых одна и та же ссылка, могут быть разными? не понял этого момента, буду рад, если кто-то объяснит
В этом то и дело что ссылка не одна и та же (посмотри дальше он ее выносит в реф).А после каждого изменения перезаписывает эту рефу
@@ВалерийАбметкаон сказал, что карстейт и ластстейт могли бы быть разными, но иметь одну ссылку
Женя, вопрос, есть ли какой то способ хранить синхронизировать состояния из стейт менеджеров из клиента на сервере в next js???
Супер. Как раз искал ролик на эту тему. А тут на бонус.
Евгений, огромное спасибо! Материал - "золото". Когда можно ждать выход курса по Saga? Cпасибо
блин рил годнота, пасиба за видосы Евгений, как я понимаю после просмотра этих видосов, можно покупать твои курсы уже посвященные архитектуре редакс, правильно понимаю?
После второго видео уже можно) скоро ещё третье будет 👌🏻
Огромное тебе спасибо!!!
Изучаю react и redux вместе с вами. Посмотрел сейчас 2 часа за 4 реальных часа)). Спасибо за труд! Не все понял в разделе 'работа с селекторами'. Можете кто-нибудь подсказать правильно ли я понял несколько моментов по useSelector?
1. Все селекторы вызываются каждый раз при обновлении любой части стора
2. При вызове селектора всегда происходит сравнение того что он возвращает (актуальные данные) с предыдущим состоянием этого же фрагмента данных в сторе по ссылке с помощью ===
3. Если ссылки разные, то инициируется рендер компонента в котором используется данный селектор
4. Если изменить ссылку на данные в селекторе (например возвращать новый массив отсортированных юзеров) то старый и новый стейт будут всегда не равны, даже если в реальном сторе этот фрагмент данных не изменился. Это приводит к лишним рендерам компонента.
5. Если замутировать возвращаемый из селектора стейт: например поменять поле объекта, то рендера не будет т.к. ссылки все еще равны. И это anti-pattern
Евгениально! Спасибо большое за ваш труд
Спасибо за ваш труд! Скажите пожалуйста, я только начинаю смотреть видео, я не увидел в таймшортах про toolkit, хотя в заголовке видео он есть... Вы будете про него рассказывать?
Да будет, ближе к концу
Евгений, а можно использовать место redux, useContext???
на больших проектах лучше всего использовать редакс нежели контекст
Вам не кажется, что цикл скачиваний redux тупо замкнулся?)) Учат потому что больше всего скачиваний, а больше всего скачиваний, потому что много учеников?))) Спасибо за видео! Полностью согласен - redux нужно учить в первую очередь, хотя бы для того, чтобы потом больше никогда его не использовать в продакшен))
Почему ?)
Вооо, как раз хотел разобраться подробнее как работать редакс 😮
Спасибо большое! Очень хорошее объяснение.
Просто лучший контент по фронту. Есть вообще курс по разработке энтерпрайз на реакте?
Евгений будет ли продолжение курса по React c приложением крестики нолики?
Спасибо за такие полезные видео! максимально полезно
Вот это да! Респектище!
Вспоминаем ролик про Redux в 2023 с чаем для успокоения 😂
Спасибо за курс!
Я очень редко пишу комменты, но реально топовый курс
Евгений, огнище 🔥🔥🔥
Раздел зачем нужна иммутабельность объяснен очень сложно (скорее всего из-за отсутствия примеров)
Благодарю за такой подарок!
крч как я понял immer c прокси буквально копирует предыдущий стейт (или то, над чем работаем), делает в нём мутабельные изменения и засовывает этот объект как new state (но довольно оптимизированно)?
Скорее нет, мы мутирует объект с прокси. Он понимает что мы замариновали и делает эти изменения иммутабельно (создавая новые объекты)
Супер контент, спасибо
то что надо). Все видео про редакс тулкит на русском почти 2 годовой давности. Делал пет проект по уроку, пишу так же как и он но у меня не работает... оказывается уже так нельзя писать(((. Да и к тому же надоело скопировать код в точь точь не понимая что это и почему так пишется
как человек который работает реакт разрабом скажу что, курс для меня полезен. спасибо!
Огромное спасибо за видео! ❤
Плохо что в исходниках к этому видео уже готовый код..
А почему не перейти на recoil в 2024?
Женя, ты лучший.
Настоящий препод.))
парень чисто красавчик!
Ладно понял ты правда крут. Подпишусь всё таки и колокольчик поставлю)
а второй части нет? не нашел на канале.
Вот вторая RTK Query, Thunk, createAsyncThunk | Продвинутый полный курс | Часть 2
ua-cam.com/video/9NVDzMW6b1k/v-deo.html
@@paromovevg спасибо. не заметил. ну заодно активности в комментарии добавил.
в итоге редакс или что-то другое?
вторая часть где будет доступна?
Уже на канале
@@paromovevg ты крутой!
@@paromovevg на рутеб или вк не планируешь выкладывыать? смотреть стало не возможно из-за тормозов
Вы спаситель
урок отличный, только вопрос возник почему такой умный и типизированный Redux не подхватывает типы Action
круто! да это ж круто (с)
Видос по редакс от Жени - это как поход к стоматологу. Давно знаешь, что надо сходить вылечить зуб (разобраться в редаксе), знаешь, что сам не справишься, тянешь до последнего, терпишь 3 часа, потом пол дня отходишь, но в итоге радуешься, что наконец-то можешь жевать (писать нормальный стор).
А вообще я после попыток в редакс и доводов Жени в пользу зуштанд, пощупал послений и остался крайне доволен. Но с конъюнктурой рынка нужно считаться. С редаксом мы ещё надолго.
Жене мешок лайков за бесценный контент. Мало такого.
Пойду куда-нибудь резюме закину😂
Отличная аналогия!) С редаксом разобрались, теперь бы реально зубы вылечить.
Красава ! Мощно 👍
почему так мало просмотров, на этом кладезе знаний
Странно что начал аж с подписок а не простой структуры диспатч фэтча
Гений!
А говорят для FSD редакс-тулкит не очень
Как раз в 3 уроке показываю как адаптировать RTK к fsd. Сейчас всё норм с этим
На 54:45 звук шумов каких-то так резко появился и автор буквально застыл, рефлекторно ожидал что скример вылезет xd
Спасибо
Ты лучший !!!! 😢
Привет
Спасибо)
1:54:45 не сдержался)))
В самом начале ввёл всё как на видео, useEffect с forceUpdate, ничего не работало. Чат gpt переделал код с useSelector, всё заработало. Почему бы сразу не делать правильный вариант, а то сперва какие то костыли, а useSelector разбирается потом
Это не костыли, а демонстрация того как работает react-redux "под капотом", и, видимо, вы ввели не все как на видео, потому что все работает с forceUpdate. useSelector это часть react-redux, это отдельная библиотека, а не "правильный вариант".
vite - читается как "veet" (с французского пришло)
всем похуй
Нужно переименовать ролик в "Божественный курс по Redux + Redux Toolkit" ))
Awesome
Кайф
Редукс, да и реакт в 2к24 - это как гонять на дедовской ниве, когда весь мир пересел на электрокар с автопилотом.
а что такое электрокар с автопилотом? ангуляй и энвилоуп?
когда это друже обломов успел стать программистом?
Для понимания базовых концепций для только знакомящихся - ua-cam.com/play/PL6DxKON1uLOHsBCJ_vVuvRsW84VnqmPp6.html
тут же с самой базы и начали
удалите плиз redux со своих компутеров, это вирус
ща бы это говнище юзать в 2024, это самый конченый из стейт-менеджеров который только может быть
меня хватило на 7 минут , нудно
опоздал на пару лет, это уже дно устаревшее
Ну да, то еще старье. Всего то 3.5 млн скачиваний в неделю на npm.
@@2Extremum у jquery 10.5 млн. Получается что довод не очень...
@@workshur Ну сравнивать стейт менеджер с библиотекой мягко говоря не корректно. К тому же jQuery он как РНР, его хоронят уже лет 15 и еще столько же минимум будут хоронить, но по факту на 8 из 10 сайтов он работает.
@@2Extremum а у тиктока несколько десятков млн посещений в день, так что довод бессмысленный. автор комментария утверждает, что говнокодный redux устарел концептуально
@@uvwzyx Вообще я писал о Redux Toolkit. А насчет "говнокода", так ругать каждый мастер, только никто пока не выкладывает свой "правильный" стейт менеджер. Я пробовал и Mobx и Zustand и Recoil, даже свой пробовал писать - неблагодарная задача и не факт что в ней можно найти идеальное решение. Потому знать эти инструменты в любом случае нужно. Особенно когда хочешь устроиться на хорошую зарплату.
beast
Что нужно сделать чтоб видео от этого автора больше никогда не появлялись в рекомендвоанных???
а что настолько сильно не нравиться?
Нажать на кнопку убрать из рекомендаций?