Video není dostupné.
Omlouváme se.
Redux Полный Курс
Vložit
- čas přidán 16. 03. 2020
- Эксклюзивный контент на моем Boosty: boosty.to/vlad...
Исходники тут: t.me/js_by_vla...
Telegram: t.me/js_by_vla...
Instagram: / vladilen.minin
Roadmap по каналу:
vladilen.notio...
Дополнительные ролики для комфортного прохождения курса
Полный курс ES6: • JavaScript ES6 - Полны...
Webpack: • Webpack - Полный курс ...
Деструктуризация: • Урок 16. JavaScript. В...
Замыкания: • Урок 3. JavaScript. Чт...
Полный курс по Redux 2020. Внутри ты увидишь разбор всех функций, которые в нем есть: createStore, compose, applyMiddleware, combineReducers и как работать с DevTools. Из видео ты узнаешь какие проблемы Redux решает, зачем он вообще нужен и как его создать с нуля!
Исходники начала тут:
github.com/vla...
Redux. Полный Курс 2020
#redux #javascript
Исходники тут: t.me/js_by_vladilen/155
Эксклюзивный контент на моем Boosty: boosty.to/vladilen
Ставьте плюсы если хотите увидеть, как редакс применять в React, Angular и других фреймворках. Напиши, в каком хочешь)
React
Angular
ANGULAR
Angular
react
Лучший спикер на просторах русскоязычных курсов!
Выучился и получил работу благодаря твоим курсам!
Спасибо!
Крайне рад за тебя 👍🤗
Курсы Владилена тоже легли в базу) Тоже сменил профессию и начал работать и применять знания (в основном JS)
Ребят, какой у вас был roadmap??? Владилен вспоминал об этом в уроках, но я так и не нашел этого видео. Может быть вы подскажите как вы достигли первой работы и что умели? Заранее низкий поклон!
@@vlad-qq Не могу дать однозначного совета. Если коротко, то Я начинал с нуля чуть более года назад. Я понимал, что выучить язык программирования - сложно и долго, поэтому начал с HTML, CSS. Примерно через 1 мес Я начал понемногу учить JavaScript, jQuery, чтобы можно было работать с библиотеками. И через 3 месяца после старта Я нашел работу в веб-студии, как верстальщик. И уже на работе Я продолжаю изучать то, что интересно ( например, у нас не используют React, но Я все равно его учу самостоятельно). Времени на обучение было потрачено очень много, если это выходные - то по 8-10 часов сидеть, учить, верстать, а если будни - то после работы до часу ночи сидишь и верстаешь. Как-то так
@@vlad-qq у него стрим недавно был, глянь, там много про это
21:00 - свой redux
42:00 - redux библиотека
49:00 - redux thunk (async button)
59:30 - сменить тему
1.13.20 Владилен наканец-то поставил ; я думал что никогда это не увижу...
хахахахахахаха
42:05 вот это поворот, такой наглядный пример реально сразу все по полочкам разложил, шикарное видео, еще пока в процессе
"Состояние - это то, что пропало" - наиболее простое и гениальное определение состояния в интернете имхо)
Самое крутое объяснение :)))
Должен сказать, спикер хорош, за видео спасибо, объяснил как всё работает понятно и на пальцах.
Но технология выглядит как редкостная дичь, и не понятно зачем именно всё это.
Если всё настолько сложно в таком простом приложении, в большом проекте наверное нереально будет найти все зависимости между файлами даже для самого простой функциональности.
было:
- 1 файл
- 37 строк
- время написания готового решения ~13 минут
стало:
- 4 файла
- 130 строк
- 3 библиотеки
- расширение для браузера
- время написания готового решения ~50 минут
ухудшилась читаемость кода, увеличился объём кода
раньше чтобы добавить код, просто добавлял код в компонент
теперь:
1) добавить новый type в types
2) импортировать новый type в actions
3) добавить новый action
4) импортировать новый type в reducer
5) добавить код в reducer (собсно чего мы и добивались)
6) импортировать новый action в компонент
7) добавить вызов нового reducer через action
из плюсов:
1) код теперь выглядит так как сказал какой-то умный тип из фейсбука
2) у нас есть расширение, в котором мы можем следить за стейтом
В том и дело, что в больших проектах это будет централизовано и находиться в одном месте, а компоненты будут обращаться к единственному источнику правды и не будут конфликтовать друг с другом, а разработчику не нужно будет каждый раз гадать: откуда из моих 200 компонентов достать вот это вот состояние и почему оно тут такое, а в другом компоненте другое? А в маленьких проектах типа того, что в видео, понятное дело, такое не нужно. Но не показывать же основы редакса на энтерпрайзных гигантах.
А насчёт читабельности и кучи оверхеда в какой-то степени соглашусь. Например, в Vuex всё гораздо лаконичнее выглядит. Но зато мы получаем сильную связанность и хорошую типизацию. Меня каждый раз очень раздражает, когда ты строкой стучишься до экшена, делаешь опечатку или передаёшь не те параметры, а узнаёшь об этом только в рантайме.
Как же вовремя. Большое спасибо! Как раз захотел изучить эту технологию
У меня на канале есть пара видео про Redux Toolkit, инструмент упрощающий работу с redux От разработчиков редакса) заходите смотрите)
у тебя тоже годнота)
Гайд по редаксу
Любой другой: Ну редакс это .....
Владилен: Сейчас я покажу как написать свой редакс
Вот эти особенности подхода к обучению и ставят Владилена на две головы выше любого другого преподавателя (из тех, что лично мне встречались).
Это пять! Думаешь, как люди доходят до таких решений. А с мягкой подачей информации Владилена, кажется что и сам сможешь свой блекджек))
Вы лучший на ютуб, у вас талант к объяснению, к логичному постепенному раскрытию информации
Всегда смотрю вас если хочу что то понять
удивительный симбиоз опыта и лаконичной подачи материала. браво! благодарю!
Мужик, ты просто спасаешь людям жизни своим CZcams каналом и курсами на Udemy.
Нет слов) Спасибо очень круто)
Спасибо! Хотелось бы увидеть Redux в связке с React, Angular, Vue.
Бро уважаю твой труд✊. Спасибо большое 🤘✌️ Ждём новых видосов.Лови мой Царьски лайк 🔥💪
Классный контент, но балдеть от него начинаешь только выучив базовый ES5, ES6. Хотелось бы, чтобы Вы "запилили" какой-нибудь серьезный проект.
Долго не мог понять как он работает, учу его уже 2 дня) А теперь понятно стало всё! Спасибо большое автору! Теперь осталось только с сагами разобраться))
Большое спасибо за ролик, оказалось куда проще, чем я думал.
"Все гениальное просто" п.с. особенно в руках у специалиста....
Гений, Божество, Оракул 21 века
Учу реакт и не понимаю, что такое state и с чем его едят. После просмотра 7 минут видео понял зачем это нужно, в голове засуетился рой идей как эти знания можно использовать да и вообще прошло осознание своей тупости, а наступил катарсис прозрения
Спасибо! Вроде много просмотрено и изучено, но ваш контент всегда приятно посмотреть! Гарантированно можно встретить что-то новое, либо другой взгляд на некоторые вещи... короче благодарю за актуальный контент!
Урок как всегда на высшем уровне!!! Понятно и доступно. Благодарю!!!
В самом начале видео ты перезагрузил страницу и все счетчики сбросились и это был один из основных аргументов для перехода на Редакс. Потом вот весь этот курс, качаю репу, меняю стор, перезагружаю страницу и вуаля - все сбросилось)))
Только ради этого просмотрел полтора часа видео, что бы не пропустить код, и ждал когда он засетает фичу с перезагрузкой браузера, и где она??? БОЛТ!
Прекрасный курс. Приятно, что все идет в формате "Проблема -> Решение"
Огромное спасибо, добрый Человек!:) Наконец то я разобрался в редаксе)))
Посмотрел видео Владилена и внезапно чётко осознал, что такое redux и как его юзать. Перед этим, конечно, просмотрел 70 роликов курса "React - путь самурая" от Димыча и прочитал книгу "React в действии". Этот же шедевральный ролик систематизировал знания, так сказать зашлифовал. Автору респект!
Путь самурая - вода водная. Лет 5 учить будешь
React в действии - меня чуть не стошнило от этой мутотени, бросил после первого подхода. Как такое дочитывают?) Автор просто графоман
Спасибо, наконец-то я понял как redux работает. лайк однозначно!
Было бы здорово сразу увидеть в комплексе связку React + Redux + Typescript + Storybook. За этот урок конечно огромное спасибо!
вышел такой ролик
Огромное спасибо за твой труд, Владилен!🔥
От просмотра получил больше пользы чем от 11 лет в школе!🚀🚀🚀
Давай редакс + реакт плиз
Очень круто !!! IT-camasutru пробовал смотреть, но там по redux каша полная. А здесь все по-полочкам. Я бы себе КУЧУ времени сэкономил если бы сразу посмотрел ЭТИ полтора часа !!!
У Димы хороший контент, но у меня другой стиль подачи :)
@@VladilenMinin Я кучу времени убил зря на его канале. Сейчас я понимаю что на момент записи он половину и сам не до конца знал, не то чтобы объяснить кому-то.
В любом случае рад видеть)
Ну дима все разжевывает по несколько раз
Там его нужно смотреть с попкормом на телеке, хотя он даже шрифт не увеличивает и + тема белая
Я тоже на камасутре споткнулась об redux и не смогла дальше смотреть)) а здесь понятнее как-то
Спасибо,Владилен! Очень доходчиво , информативно и без воды. Оказывается я все делаю правильно))
Спасибо за твои tutorial -ы. Благодаря ним знаю Javascript и React
Для тех, кто хочет освоить профессию Frontend разработчика за 7 месяцев -
bit.ly/3bu7FVD
Освоить основы веб-разработки бесплатно. Курс по HTML & CSS - bit.ly/3OtR9Un
Отличный видеоурок, всё чётко и без ошибок: всё реализуется и работает как изложено в видео. Хотя, чтобы хорошенько разобраться, нужно как следует владеть синтаксисом JS. Благодарю за труды!
круто, очень круто. 2 книги по редаксу пробовал, там сразу все непонятно. спасибо за подход, за подачу. очень круто!
как же это вовремя, спасибо большое
Классный курс, спасибо! Пользуюсь redux + thunk уже пару лет, но все равно было интересно посмотреть
+ У Владилена что хорошо, он не только объясняет в теории такие технологии как Redux, Паттерны, например, но также на практике это всё показывает, это прям очень круто, далеко не везде такое есть
Очень круто, спасибо!
А еще не по теме, а просто комплимент твоему телосложению. Отлично выглядишь))
Шикарный урок, спасибо. Теперь смотрю все уроки Владилена. Пару замечаний по видео:
1) брать тему из класса HTML - не верно. Нужно было взять из store.getState().theme.value. Ведь это стостояние (Best practices).
2) subscribe должен оставаться вверху файла, до всех других dispatch (внутри event listeners). Иначе они могут пройти до подписки.
Крутой ролик, всё самое главное расмотренно и продемонстрировано, а самое главное показано как сам Redux реализрван на чистом JS, за что спасибо, так понимать весь концепт гораздо проще.
Одним словом, красава)
Очень внятно объяснил. Я более 8 лет работаю бекенд разработчиком, но для своего стартапа нужен был фронтенд. Несколько фронтендщиков пытались что-то пилить на реакте, но не особо бы тро получалось. Решил сам углубиться в эту тему, чтобы понять в чём сложность. Пойду ка послушаю ещё про реакт :)
Когда озвучивал содержание. Думал, что будет серия уроков. А тут прям в полтора часа уложился. Превосходно! И спасибо!
Такого ещё много на канале)
Наконец-то redux рассматривается отдельно от react, сразу лайк!
дак в реакте, редакс такой же
Владилен, огромная тебе благодарность за столь простое объяснение концепции Redux.
Владилен, ты мой кумир. Подписался на твой канал и буду смотреть все видео ролики. Ты мастер объяснять!!! Сколько лет работал с редаксом, но вот после твоих объяснений я наконец понял что это такое на самом деле ))))))
Я в восторге, большое спасибо за такое понятное и четкое изложение сути редакса! Видео очень помогло в моем обучении ❤️
вместо того, что бы инициализировать subscribers как массив добавлять в него что-то а потом вызывать можно было бы сделать таким образом:
там где мы возвращаем методы :
subscribe: (callback) => {
subscribers = callback } , а в методе dispatch просто вызвать subscribe(). Это вроде как смотрится проще, да и зачем создавать массив в котором всегда будет лежать одна функция?
выражаю вам огромную благодарность за видео
Потому что подписчиков может быть сколько угодно
Спасибо огромное! Не передать, насколько понятно и полезно!
Спасибо! Все круто разложено по полочкам и объяснено простым языком с прозрачными примерами! Респект!
Однако одну очень крупную и важную теме все таки обошли, и, как мне кажется, сознательно, что плохо...
Redux пропагандирует идею одного store. И в случае site это, возможно и не критично, а может и круто...
Но есть SPA, где нужны вложенные store. Разработчики Redux предлагают использовать... селекторы?!.
Например, есть страница с таблицей, диаграммой и картой.
Пусть таблица будет простой сущностью - массив объектов, атрибуты которого - значение столбцов.
Диаграмма состоит из серий. Серия - линейный график. Серия состоит из точек - дата и значение.
Карта состоит из слоев. Слой это массив векторных объектов. Объект состоит из свойств и координат.
Есть вторая страница с двумя картами, тремя таблицами и четырьмя диаграммами...
Между страницами я хотел бы иметь возможность переключаться без перезагрузки данных с сервера))
Логично, что каждую таблицу я хочу рассматривать как store.
А так же, введу дополнительного функционала мне нужно рассматривать серии и слои как store.
Если список таблиц, диаграмм и карт я представлю как массивы в состоянии приложения, то что делать с их store - сериями и слоями?
В классическом Flux центром мира является шина событий. Сторы реагируют на события из шины событий.
Да, сделать снимок состояния приложения сложно. Зато сторы не зависимы.
Я могу расширять функциональность приложения плагинами. Могу когда угодно добавлять новые обработчики, а не только при создании стора...
Поясните, как с помощью Redux решать практические задачи, а не задачи уровня лабораторных работ?
Очень хорошее повествование. Плавно, по полочкам и в правильном порядке
Владилен, ты лучший! Теперь у меня появилась вера в то, что я его когда нибудь пойму )))
Здоровья вам и вашим близким щастья удачи и денег
Великолепно!!! Браво, автор!!! Спасибо огромное!!!
После 40 выпусков Пути Самурая идеально заходит. Отличное видео для повторения всей концепции.
Спасибо за видео!
Angular+Redux Очень бы хотелось увидеть!
После просмотра видео, и после того, как еще раз разобрал все по полочкам возник один вопрос - чем так плох 'vuex' чтобы вместо него применять 'redux'? Постоянно сравнивал их по ходу изучения редакса и для меня 'vuex' это одна монолитная максимально понятная структура с асинхронными операциями в коробке, еще и разбросать его по модулям(для сложных приложений) дело пару часов, при нулевых знаниях, в то время как в редакс все разбросано по компонентам, которые ты все настраиваешь, и собираешь в одно целое, не пойму, чем плох vuex?
Люблю тебя бро! Спасибо за труды!
Отличный Контент! Про работу совместно с React js было бы Круто!
Спасибо за контент!
спасибо за труды.... очень помогаете в теме просветления )
Спасибо за видео! Очень хорошо объясняешь, как всегда! Ты в конце видео говорил, что если интересно как взаимодействует redux с фреймами, то пишите в комментарии. Очень интересно посмотреть связку react+redux и redux-подобного vuex с vue!
И спасибо огромное за творчество твое и твой канал!
Изучаю реакт редакс, и дойдя до редакса очень все запутано , так сложно , вроде понимаешь как сделать но не до конца как будто зачем это всё , но ты своим видео хоть оно и не про реакт , мне так все обрисовал что я тут же разобрался в своем проекте что и как делается и для чего , спасибо тебе огромное за твой труд )
Спасибо! хоть и в платном курсе redux был, с удовольствием посмотрел!
Спасибо, всё супер как всегда!
Очень круто и доступно! Владилен, нет мыслей выпустить видео, как правильно понимать чужой код (допустим большой проект) и уметь правильно читать его?
Для тех, кто решил пройти туториал 4-х летней давности, как я:
Возможно при билде вылезет ошибка, связанная с созданием сущности класса Hash.
Я починил, добавив в команду "start" "set NODE_OPTIONS=--openssl-legacy-provider && " перед "webpack-dev-server --open"
Спасибо, доходчиво объясняешь. JS интересная штука, никогда бы не подумал
Лучший туториал!
Хотелось бы в будущем понять как хранить это состояние на бекенде. Простом на node js
Без воды и по делу! Спасибо, лайк!
Владилен, большое спасибо тебе за твой труд! Он очень полезен!
У меня есть лишь одно пожелание.
Можно разбивать курс не небольшие тематические блоки, где ты будешь просто говорить "Сейчас можете поставить на паузу и попробовать повторить то, что сделал ты". То есть давать некий сигнал, где закончился какой-то небольшой блок.
Просто проблема в том, что курс, длительностью более часа, тяжело запомнить и после просмотра сразу его весь повторить, а делать параллельно с тобой тоже не удобно получается, приходится постоянно ставить на паузу. А сразу, самостоятельно, увидеть границы тематические не так просто.
Можно еще знаешь как, допустим, в начале описать задачу, решение которой ты сейчас будет реализовывать, то есть типа небольшого ТЗ :) И например можно в этом моменте ставить на паузу, попробовать сделать самому, потом посмотреть блок в твоем исполнении, и потом по памяти исправить или доработать свой. Что-то типа такого))
1:07:51 - имхо считывать значение темы из дом элемента немного противоречит общей концепции (а если классы изменятся или тег body больше не будет подвязан на тему), лучше наверное взять значение из стора
Вообще спорно. Если классы изменятся то что мешает изменить и реализацию, она же в index.js в обработчике событий, тут как раз нет противоречий.
Хотя я тоже остановил видео и реализовал самостоятельно через стор, а когда начал смотреть то понял, что Владилен просто показал, как передать параметр из вне.
к слову, вместо того, чтобы создавать и вызывать конкретные disableButtons, enableButtons, можно инвертировать зависимость -> внутри асинхронного экшна вызывать условно PENDING, FINISH экшны в нужный момент и в стейте держать статус, а на стороне view - выключать кнопки (а может и что-то большее, вот в чем плюс этого подхода) уже реагируя на этот статус
Досмотрел, спасибо большое, я бы тебе 5 колокольчиков бахнул, если бы это было возможно :D
action можно определить как правило, согласно которому изменяется state. То есть это формулировка действия, а не само действие. Правил, то есть actions, может быть сколько угодно.
Сами действия это dispatch action, которые выпоняет reducer.
Отличный курс, спасибо)
Спасибо за урок!
Спасибо за сжатую ценную информацию!!! Очень хорошо систематизировано, как всегда!!
Классно, мне как начинающему разработчику очень заходят курсы. Единственное, в этом видео было сложно поймать момент перехода от полностью самостоятельно написанного redux к использованию библиотеки.
Спасибо! Очень полезное видео. Начал понимать как это работает)
Большое человеческое за объяснение redux-thunk, да и в целом удачное видео.
57:00 нужно было еще раз вызвать state.getState() после вызова next. Вроде должно было вернуть уже новый стейт
Да, мы стейт изменили, можно его по новой юзать :)
Хотя логер от редакса покрасивей будет
Офигенно, спасибо!
Спасибо большое, хоть немного появились поинты, за которые можно зацепится
Очень крутой урок! Спасибо))
Отличный материал, все доходчиво, понравилось разъяснение, что примерно под капотом Redux
Вот я недавно начал изучать react. Поэтому за вопрос не обессудьте. )
Зачем нужен redux? В смысле, зачем нужен глобальный state? Разве мы не можем просто создать глобальную переменную и туда что-то записать?
Вы очень крутой преподаватель по js. Спасибо вам!
Молодец. Приятный голос и взгляд на обучение
Спасибо за видео!А почему нельзя вместо Redux использовать глобальные переменные? Например задать в главном компоненте несколько переменных, это будет State, а другие компоненты будут их изменять и перерисовывать View.
Владилен хорошо объясняет, но..блин, может я какой-то слабый на голову, но я за неделю изучения редакса так толком и не понял как он работает и зачем это всё нужно.. (
еще мне кажется не плохой вариант решение задачи выключения кнопок при асинхронном запросе это создать переменную loading и перед началом асинхронного экшена включать экшеном лоадинг в тру а в конце менять на фолс =)
кайфовые у тебя уроки, спасибо
Отличное время прокачать свои скилы в период самоизоляции. Спасибо!
Спасибо автору, неплохое объяснение!
Владилен, Спасибо тебе за твою работу!
И речь и материал на уровне. Спасибо!
Спасибо большое за твои труды, Владилен!
Посмотрела курс, стало более-менее понятно, но теперь прошу снять видео, как соединить React и Redux! Заранее спасибо :)
На канале следующий за этим ролик
@@VladilenMinin спасибо ))) как раз сажусь за компьютер,чтобы эту темку продолжать изучать! Было предположение вчера,что возможно уже есть)))
Новый курс по ноде это здорово, забрал сразу, жаль только что express, а не koa2 которым я пользуюсь.
Спасибо, материал очень полезный!