Redux-Saga React Полный Курс. Урок 1. Саги, Эффекты, Генераторы.
Это первый урок из цикла обучающих видео о Redux-Saga на русском.
Redux-Saga - это middleware для redux, цель которой - сделать асинхронные операции в React приложениях: эффективными для выполнения, легко управляемыми и тестируемыми.
Ключевая концепция редакс саги - это создать отдельный поток в нашем приложении, который несет полную ответственность за все побочные эффекты.
👉 Менторство, обратная связь и поддержка / wisejs
Для полного понимания нужно смотреть видео полностью.
Таймкоды:
00:00 - Концепт и шаблон проектирования сага.
00:54 - Генераторы в ES6, function*, yield.
08:00 - Разворачиваем react приложение и устанавливаем redux-saga.
09:55 - Подключаем sagaMiddleware и создаем redux store.
15:00 - Создаем первые саги. Saga watcher, saga worker, effects.
17:22 - Effect take.
20:59 - Effect takeEvery, takeLatest, takeLeading, работа с промисами.
23:35 - Реальный запрос на сервер через fetch.
26:33 - Effect put.
28:17 - Effect call.
29:43 - Паралельные задачи redux-saga..
32:54 - Effect fork.
34:38 - fork vs call. Разница между эффектами.
38:04 - Обработка ошибок в разветвленных задачах (вызваных с fork).
39:22 - Effect spawn. fork vs spawn.
41:26 - Effect join.
43:25 - Effect select.
44:40 - Резюмируем концепцию и эффекты Redux-Saga.
Приятного просмотра! Буду благодарен за поддержку в виде комментария и лайка)
✔️Если хочешь изучать программирование со мной, не забудь подписаться :)
kzread.info/dron/Oxq.html...
✔️Мой телеграм канал: t.me/joinchat/RVq-cmt6n1SJRS7Z
#reduxsaga #reactreduxsaga #reduxsagaeffects #редакссага #реактредакссага #редакссаганарусском
Пікірлер: 157
Поделись своим впечатлением о первом уроке, зашел? Также оставляй свои идеи для будущих роликов:)
@Deadricss5
2 жыл бұрын
Очень! Спасибо тебе!
@romanmed9035
2 жыл бұрын
увидев в другом видео обещание выпустить по сагам, попробловал найти в списке но не нашел. а потом случайно увидел в ссылках в конце другого видео.
@juliakim1642
Жыл бұрын
Спасибо, классный туториал !
дай бог тебе здоровья, ты единственный кто сделал курс по саге, по ней вообще мало информации, ждем продолжения
@wisejs
3 жыл бұрын
спасибо! приям мотивация записывать еще!)
@user-uu5ub4lh3y
3 жыл бұрын
@@wisejs я тебе больше скажу, я искал понятную информацию про метод fork, ни как не мог понять для чего и как его использовать, понимал только что он не блокирующий, посмотрел твоё видео и сразу на примере все стало на свои места, благодарю за столь ценную информацию и на столько понятную, мой тебе совет, раскрой тему саг по полной, потому что нет ни одного нормального видео руководства по сагам, даже на зарубежных источниках, смотреть в документации очень не понятно, не знаю кто там писал её, но явно не для людей писали, в любом случае многие будут тебе благодарны даже при условии, что не будут подписываться и лайкать, потому что аналогов по сагам нет, ты единственный кто решился на это, всего тебе наилучшего и успехов с подписчикам.
@wisejs
3 жыл бұрын
@@user-uu5ub4lh3y по той же причине я и затеял этот курс. Дока запутывает, а в существующих видео ничего не объясняют. Пришлось читать source код и разбираться. Спасибо!
@user-uu5ub4lh3y
3 жыл бұрын
@@wisejs я не знаю будет ли в дальнейших видео такой эффект как all, но он весьма разгружает написанный код, у тебя в rootSaga вотчеры через yield указаны, а сам вотчер чуть выше, для простого примера такой вариант подойдет, а вот когда саг становится много, лишний код только мешает, лично мы используем вот такой синтаксис export function* rootSaga() { yield all([ takeLatest(actionTypes.GET_PRODUCTS_LIST, fetchProductsList), takeLatest(actionTypes.GET_ME, fetchMe), ]); }
@wisejs
3 жыл бұрын
@@user-uu5ub4lh3y да, будет в самом начале следующего!
Как раз redux-saga изучаю. Вот это подгон. Я бы даже сказал, не подгон, а ПОДГОНИЩЕ!
@wisejs
3 жыл бұрын
Спасибо за поддержку!
Просто СУПЕР, так внятно и просто объяснил. Лучшее объяснение на данный момент во всём русскоязычном ютубе, и может в целом :) Молодец, так держать!
@wisejs
3 жыл бұрын
спасибо за такую высокую оценку, мне супер приятно))
Спасибо бро за видео урок! Только после этого урока начал понимать что ж такое Redux Saga. Продолжай в том же духе! Хорошо объясняешь
Все еще самый понятный ролик про сагу на ютубе. Спасибо тебе большое!
3 канала в рекомендациях за неделю, и все крутые
Спасибо за ролик. Мне понравился урок. Я аж подписался. Смотрел уроки других людей, ничего не понял.
Спасибо, бро! У тебя самые лучшие гайды!!!
@wisejs
2 жыл бұрын
дякую!
Чувак ты лучший! Не видел ни одно видео в ютубе где так четко бы объясняли про сагу!
Просто волшебный урок, все кратко и ясно
Отличный урок) спасибо большое :)
Спасибо, жду ещё видео :)
Дружище, как же четко! Спасибо
Классный контент! Спасибо!
Классное объяснение!!! Продолжай в том же духе!
Спасибо большое за отличное видео по базовым вещам в Redux-Saga!
Спасибо за урок, именно то, что искал.
большое тебе спасибо, круто объясняешь!! продолжай в том же духе!!!
Вот теперь я понимаю что такое redux-saga, спасибо большое. А как это использовать надо еще научиться и пересмотреть пару раз данный туториал)
Красава! Очень годно) Спасибо и удачи с каналом :)
@wisejs
3 жыл бұрын
спасибо за поддержку, ценю 🤜
Круто, спасибо!
Лучшее объяснение что я видел, спасибо!
Отличный курс!
ОГРОМНОЕ спасибо, бонус в карму за именование эпизодов
Спасибо огромное! Очень круто объясняшь ❤
Хорошее видео. Спасибо!
Ну просто супер! спасибо!
Хорошо, что есть такое видео. Мне было очень познавательно и полезно посмотреть.
Лучший гайд по сагах, продолжай в том же духе !!!!!
Спасибо! Очень помог с пониманием.
Отличный курс, просто и доступно для понимания.
Рада что нашла Ваш канал!! Доходчиво супер! Один из немногих, кого приятно слушать ))
вообще бимба! маст хэв для всех начинающих! спасибо за старания!
Лучшее объяснение саг которое Я видел) спасибо братец
Шикарное видео! В проекте Saga и теперь стало понятно как это работает. Очень буду ждать новых видео! Подписался на канал не задумываясь)
@wisejs
3 жыл бұрын
спасибо, рад, что ролик оказался полезным)
круть! наконец разобрался как работают fork и spawn. Спасибо! побежал смотреть следующие Ваши видео по сагам )
Замечательный курс! Жду второй урок! Спасибо за труд
@wisejs
3 жыл бұрын
спасибо за фидбек, мне это важно)
Спасибо, что подписал там где не совсем корректно объяснял. Благодаря надписям понятно всё стало тоже. Спасибо за постобработку в общем, а не просто снял и выложил в интернет.
@wisejs
2 жыл бұрын
Спасибо за обратную связь! Люди по разному усваивают информацию, потому стараюсь доносить всеми возможными способами :)
топчик, сжато и понятно
Отлично, жду продолжения
@wisejs
3 жыл бұрын
будет)
Очень крутой урок! Спасибо🙃
@wisejs
3 жыл бұрын
спасибо и вам)
Спасибо, понятно объясняешь
жирный лайкос! Попал на проект с сагами, с видео все легло по полочкам)
Великолепный урок, все очень доступно, понятно и с примерами
Супер.!!!
Redux-Saga React спасибо. Очень понятно
Жду полного курса! Очень круто! Продолжай!
@wisejs
3 жыл бұрын
спасибо!))
Красава!)
Спасибо огромное
Премного благодарен за данный материал! Сейчас пишу на react-native с использованием саги, очень хорошо объясняете , стало гораздо понятнее механизм работы =)
Ты крутой! Спасибо за отличное видео!
Автор, ты просто Бог!
Поставил лайк и подписался, не останавливайся и пили дальше контент🔥 у тебя реально хорошо получается
@wisejs
2 жыл бұрын
Спасибо, будет больше 👍
Хорошее видио, спасибо
@wisejs
3 жыл бұрын
приятно слышать , спасибо)
Отличный урок. Автору большая благодарность
@wisejs
2 жыл бұрын
Спасибо за коммент!
Отличный видос, спасибо!!!
@wisejs
2 жыл бұрын
Спасибо за коммент :)
отличное интро для саг ! Спасибо.
Краусанчик!
блин круто !я возможно даже понял)
Блестяще !! Попал на проект а там саги без тулкита !! А я привык тулкит и санки и словил затуп. Спасибо тебе огромное, смотрел всех на свете и не понятно, посмотрел это видео и всё пазлы сложились, шикарно то что в начале есть вводное про генераторы, я их не знал и очень оказалось кстати. Дай бог развития каналу и огромное спасибо от души за работу !!!!!
@wisejs
2 жыл бұрын
круто, что мой контент стал полезным)спасибо
Thanks!
огонь!!
@wisejs
3 жыл бұрын
🔥🔥🔥
Огромное спасибо автору! По redux-saga очень мало понятных материалов, а русскоязычных вообще почти нет. А тут всё подробно разжёвано и с отличными объяснениями! Буду смотреть курс дальше, после такого прекрасного первого урока просто нельзя этого не сделать :)
сколько читал и смотрел про эти генераторы, ничего не понял тут за 5 минут все понял)
@wisejs
2 жыл бұрын
Круто! Рад, что видео помогло разобраться
Ты крут чувак)
@wisejs
2 жыл бұрын
Стараюсь 💪
Хороший видос. Контента джун+ ~ мидл маловато, спасибо за него.
Я понял!!!! ))))
Объяснение очень хорошее. Разжевал всю тему очень хорошо. На ютубе сложно найти того кто так подробно подает материал. И главное понятно. А то один товарищ , не буду говорить кто, просто тараторит, путается сам и всех вокруг запутал. Упускает все подробности и у него тысячи фанатов этих его творений, не понятно почему)))
@wisejs
2 жыл бұрын
Спасибо за поддержку!
зашел!
Замечательно, больше саги!!! Все что ты сказал по поводу ts, архитектуры , жду ! Сейчас разрабатываю проект на сагах. Как бы ты запускал для разных роутов разные саги? Что если у нас есть многоуровневые пути в Роутах? Или просто изначально все фоне запустить, но не все данные нужно сразу получать… Я ломал и ломаю голову как правильно связать саги и роутинг (пока сделал сагу, где достаю все нужные мне данные для всех роутов) И идея в том, что саги за все отвечают, все компоненты глупые и могут только создавать экшены
@wisejs
3 жыл бұрын
Я уже записал второе видео, которое выйдет на следующей неделе. И там есть связка с connected-redux-router и другие подходы. Реагируем в саге на ивенты из роутера, и компоненты максимально простые. Как будто по твоему запросу :)
@user-is6qx5ms2n
3 жыл бұрын
@@wisejs так на прошлой неделе и не вышло. Когда таки ждать?
@wisejs
3 жыл бұрын
@@user-is6qx5ms2n Завтра в 12:00.
Четко, понятно. Спасибо. Fork и Spawn напоминают promise all и allSettled.
👍💥
круто, осталось понять как работать с санкой при передаче айдишника
топ
@wisejs
3 жыл бұрын
спасибо)
Спасибо тебе. Очень хорошо рассказал основы. С этими знаниями можно двигаться дальше. Несколько раз пытался разобраться, но ужасная дока и сложная концепция ломала мне мозг.
@wisejs
2 жыл бұрын
Спасибо за комментарий, рад что видео помогло!
Отличный материал. Спасибо! Но есть замечание: Когда описываются эффекты, скажем "takeLeading", то стоит уточнять, что будут блокироваться любые воркеры для конкретного этого(!) экшна, а не любые задачи вообще. В документации, конечно, тоже не совсем однозначно описано, но все же.
Superman !
@wisejs
3 жыл бұрын
Just a regular programmer :)
@fedordostoevskiy4209
3 жыл бұрын
@@wisejs But only Superman shares his knowledge , спасибо.
Опа, знайомий голос) Привіт тобі із турнірки😉 Лайк, підписка, колокольчик і все таке)
@wisejs
2 жыл бұрын
і тобі привіт) дякую за підтримку!
Сокровище, а не курс! Не понимаю, почему Ютуб так далеко засунул в поиске лучший курс по Redux Saga. Благодарность автору, лайк и подписка!
отличное видео, будет еще лучше, если чуточку внимания будешь уделять орфографии и грамматике, спасибо.
@wisejs
2 жыл бұрын
нет предела совершенству)
Незавершённые елды, чёт орнул)
@wisejs
2 жыл бұрын
😂
Подскажите, как передвать аргументы в воркер динамически, а не как показано в видео, где мы planets и people передаем строго.
Лойс инста
@wisejs
3 жыл бұрын
спасибо))
Спасибо. Но без тайпскрипта такое) Обычно именно он боль в жопе, когда речь идёт о новых технологиях (по крайней мере у меня так). Саги еще не юзал, но что-то мне подсказывает, что это не будет исключение Да и слабой аудитории эти саги нафиг не нужны. А тем кому саги нужны, те в связке с тайпскриптом юзают) Может конечно драматизирую, но опыт подсказывает, что оно часто так. С технологией разбираешься быстро, а типизируешь потом путешествуя по всему стэковерфлоу)
а мне вот интересно по поводу актуальности саг . зайдя на репозиторий видно что основные пункты обновлялись 2-3 года назад . что скажит по этому моменту ? потому как вещь довольно объемлющая для изучения .. и стоят ли они того на сегодняшний день ?? какие бы альтернативы отметили ? пс . я не начинал смотреть (пока) , но как тут заметили , хотелось бы увидеть более менее простую , здравую незапутанную незамудрённую интуитивно воспринимаемую архитектуру и организацию файлов папок .. ) ах да ) за всё что делается СПАСИБО !!
@wisejs
3 жыл бұрын
ИМХО, для работы со сложной асинхронной логикой ничего лучше нет. Но тащить в каждый проект с простыми CRUD операциями я бы их не стал. Далее будет видео про структуру и организацию кода. Но начинать смотреть советую с этого видео.
redux-saga saga middleware async action redux react
В видео автор переключает между собой окна браузера и Visual Studio по типу слайдера? Подскажите, кто знает, как ето сделать?
@wisejs
3 жыл бұрын
Это просто анимация переключения между окнами в mac os. Типа alt + tab в windows.
Saga вообще используется с RTK?
Жаль нет кода на это видео. Если можно хотя б на код пен кидай в следующий раз)
Мало подписчиков, увеличу на единичку)
blogadaryu
old
Первый нормальный материл на эту тему, не то что у Минина.
Это наверное единственное видео на ютубе с нулевым количеством дизлайков при ненулевом количестве лайков. НОЛЬ дизлайков! Это вообще законно?
@wisejs
2 жыл бұрын
Не думаю что это продлится еще долго) Спасибо большое за комментарии и поддержку!
Саги это худшее что было придуманно для работы с асинхронным кодом, сейчас никто в здравом уме не будет начинать новый проект с этим мидлваром. Сагу придумали извращенцы.😂😂😂