69 - React JS - High Order Component (hoc)
Вставка
- Опубліковано 17 чер 2019
- 🚀Стань квалифицированным разработчиком за 9+ месяцев с трудоустройством в IT -INCUBATOR:
Front-end
it-incubator.io/front-end/?ut...
Back-end
it-incubator.io/back-end/?utm...
Поддержать меня можно на patreon / itkamasutra или оформив спонсорство на данном канале.
Помогайте друг другу вот здесь: t.me/reactjs_samurai
API: social-network.samuraijs.com/
HOC это:
- High Order Component
- Компонент Высшего Порядка
- Функция, которая на входе в параметрах принимает компонент, а на выходе возвращает новый компонент - контейнерный компонент для переданного в параметрах компонента.
HOC позволяет нам применять какое-то поведение к разным компонентам, не дублируя код.
Иначе: HOC позволяет нам создавать однотипные контейнерные компоненты для разных целевых компонент. А задача контейнерной компоненты - дать целевой презентационной компоненте какие-то данные\поведение.
Из популярных всех известных HOC-ов мы с вами уже знаем connect и withRouter
Правда connect - не совсем HOC если совсем придраться уже: connect после первого вызова вернёт нам HOC. И мы его уже вызываем второй раз.
А сама функция connect не может быть хоком, так как она принимает mapStateToProps и mapDispatchToProps, а настоящий HOC должен принимать в параметрах КОМПОНЕНТ.
Вот такие пироги!!! Летим, самураи!
Летим, самураи ;)
Уроки по React JS: • Курс "React JS - путь ...
* Сайты:
it-kamasutra.com
it-incubator.eu
samuraijs.com
* Мы в соц. сетях:
itkamasutra
/ itkamasutra
telegram.me/itkamasutra
* Мои личные VK и Insta:
d.kuzyuberdin
/ it.kamasutra.dimych
#hoc #HighOrderComponent #КомпонентВысшегоПорядка #reactjs #практика #примеры #уроки #курс
"смерть Кощеева - на конце иглы, та игла в яйце, то яйцо в утке, та утка в зайце, тот заяц в сундуке, а сундук стоит на высоком дубу"
Мне кажется, Кощей что-то знает про React....
😁
Или разработчики реакта русские сказки и матрёшки любят :)
понял что повзрослел, когда начал пересматривать некоторые выпуски
"Дублировать код это гавнокодить,
Оторвать тебе руку,
Ты - больше не самурай!"
(с) Димыч
Колоссальный объем за месяц я тут просмотрел, конечно, параллельно было бы попроще учить, наверное, с документацией, тренировкой и так далее. Но не терпится прям просмотреть все и догнать! И это лучшее, что я нашел по реакту, Димыч красава! Я Вас догоню!
за кем гонитесь-то? За знаниями или за другими людьми?)
этот курс зе бест
@@oleksandr_h спешу тебя огорчить , курс устарел как синтаксически , так и концептуально.Вот 2.0 хорош
@@ainz8656 к 2.0 плавно приближаемся )
ну что устроился?
8:33 на рисунке мои глаза, когда я пытаюсь понять трудную тему 😂
Субботний вечер - 31.07.2021. Время 22:44, а я не бритый, не мытый, в жару осваиваю HOC-и! Всем удачи, Димычу спасибо!
аналогично, мужик) пусть и говорят, что 1.0 уже устарел, хочу его пройти, всё усвоить и приступить к 2.0
Да мужик! Лучше быть не мытым, не бритым и пахнущим мужиком который знает react HOC чем наоборот!!!))))
Спасибо за урок. Лично для меня показалось сложнее, чем redux-thunk
симметрично!
Вы знаете что такое боль? Это когда ты 45 минут ищешь ошибку которой не существует, просто localhost подвис... Искал искал, плюнул, всё закрыл , посмотрел фильм. Думаю надо всё таки разобраться с hoc, запускаю IDE , стартую localhost, а оно работает ...
Тема про High Order Component зашла !) Как всегда очень понятно объяснил что такое HOC
С начало все было понятно и просто, но в конце мозг нужно было напрячь, чтобы понять все эти вложенности) HOC - High Order Component!!
ДА, не легко, надо второй раз смотреть)) спасибо, Димыч!
Спасибо, Димыч! Супер-объяснение HOC - High Order Component. С каждым твоим уроком React становится ближе и понятнее.
Зашло! Смотрел с перерывом. Восхищаюсь и получаю кайф от такой подачи материала! hoc High Ordered Components explanation
Дякую велике Дімич! Дуже інформативне відео!
Спасибо! Мозг взорван, но мотивация не пропадает, за это огромный респект!
1,5 часа сидел, пердел на этих HOC'ах. Зато понял) Спасибо за очередной урок! Бомбим дальше!
Очень детально все объяснил, как обычно в принципе) некоторые моменты про High Order Component пришлось пересматривать по несколько раз) в целом - спасибо)
Спасибо огромное за твой труд! Смотрю дальше!
Привет из солнечной Алматы. Ты делаешь нас чуточку умнее. Спасибо тебе за это!
И вот с этого момента я начал пересматривать занятия по 2 раза ! 😅
Спасибо !
High Order Component
Спасибо за видео! Пересматривал когда столкнулся с HOC на собственном проекте, и во всем разобрался😁
Отличный урок, с таким подробным объяснением становится совсем не сложно!! High Order Component!
Просто взрыв мозга! Но мы идем дальше! Димыч, огромный тебе респект за проделанную работу! дойду до 100 урока и начну пересматривать этот сериал 😅 займусь шлифовкой так сказать!
HOC - high order component
Эпизоды по 20-30 мин. это топчик.
Не успеваешь устать от наплыва новой информации.
Бомбим дальше
Удивительно, как такие сложные темы Дмитрий объясняет так понятно! Конечно, все благодаря базе, данной нам в предыдущих выпусках! Горжусь собой, однако, понимаю, что почти все это благодаря Дмитрию! Прекрасный курс по React - Redux! IT-KAMASUTRA мой любимый канал по программированию!
25 ноября 2020 в 17.00 - 100.000 подписчиков! Поздравляю, Димыч!
High Order Component (hoc) - хорошее объяснениевсе, Спасибо! Однозначно Like!
Было понятно, но до момента второго оборачивания компоненты. Дальше стало вынос мозга - для понимания, нужно пересмотреть несколько раз )))
React JS - High Order Component (hoc)
Спасибо, Димыч!
Смотрю, учусь!
Пересматривала это видео 4 раза и про compose 2 раза. Итог - написала свой хок withLoading 😎 Тема сложная,
но очень крутая и нужная , спасибо!!!
Просмотрел весь курс полностью, начал 2-й раз и дошел до этого выпуска. Со вторым разом ты понимаешь, насколько HOC'и крутая тема и как они нам облегчили жизнь! Очень круто, я доволен, что теперь разобрался! Спасибо, Димыч!
Димыч, это лучшее, что я нашел на просторах Инета! Ты молодец. Пояснения просто шикарные. По крайней мере когда смотришь просто все по полочкам разложено. Когда делаешь после, немного могу подсмотреть. Курс СУПЕР!!! HOC high order component
Мне ситуация с HOС или хоками, абсолютно понятна! Я ищу только умиротворения и вот этой гармонии! ЖДем compose из следующего выпуска, чтобы понять как сделать все это более удобочитаемым!
Очень интересно. Спасибо тебе Димыч, за то что ты сделал для нас !!!
Ваше видео наверно 4-е которое я посмотрел по hok. И только теперь понял то что не понимал ранее. А еще рисуночки пондравились. С ними прям на много понятней. Еще раз благодарю
Димыч, большое спасибо! Твое видео помогло решить проблему с HOC, которая казалась не решаемой. Огромный респект!
Дошла до середины четверга и до этого выпуска... Думаю что время затраченное на запись роликов фигня в сравнении со временем, которое затрачено на продумывание того, что и на каком этапе разложить по полочкам, как донести и когда народ созрел для новых знаний. Спасибо!
привет, ты устроилась?
Как же это увлекательно и как я люблю твои приятные выносы мозга, ведь каждый раз картина дополняется!
HOC - high order component - и component hell, пока-что единственное, в чем трудновато понять что да как, но чем дальше, тем понятней...
Ну вот, не зря сидел ждал видео=Р Лайк за лучшие уроки ReactJS, HOC. PS поздравляю с 6000 подписчиков=)
Спасибо, Антон! 🙏
80к ))))
180k (8. 08. 2023)
hoc higher-order-component in react
great lesson
thank you very much
react is awesome
couldn`t wait to finish the first part and start more difficult second part of this brillian crazy react-js course
Ух! Придется еще пару раз пересмотреть эти хоки/hoc/high order components.
Это просто выHOC мозга и дикий ХОКец 🤯 главное понять как этот ХОК собирать , потом уже легче! Спасибо за урок! 👍🏼 реакт редакс hoc react redux
Круть, мне кажется с каждым выпуском я познаю как устроена вселенная
Лучшие курсы, спасибо Димыч! React JS High Order Component
Лучшее объяснение темы HOC (High Order Component)!
Хорошие уроки! Учитывая, что это бесплатно, что-же еще можно желать. Огромное СПАСИБО за проделанную работу.
Cамодельный HOC - это просто дополнительный слой, в который можно что-то пробросить из mapStateToProps и вернуть то, что нам нужно - Redidect или Component
Большое реактивное спасибо, Димыч! High Order Component (hoc)
Крутяк! такие вещи сильно помогут поддерживать код в будущем) нежели пилить сои костыли, лучше общепринятым разделением ответственности! Ты крут, Димыч! HOC, high order component, react, redux
Спасибо за пояснения об HOC (High Order Component)! Пока просматривал видео, постоянно в коде забывал о том, что ОБЯЗАТЕЛЬНО нужно использовать return, когда делаем собственный instance axios, создаем на наших целей thunk, ну и при создании HOC. Нужны внимательность и практика.
Благодарю Димыча за урок!
High Order Component , все круто объяснил! Летим дальше!)))
То чувство, когда redux-thunk взорвал мозг меньше, чем HOC. Но в любом случае это лучший курс по реакту. Не знаю, возможно ли найти настолько крутой бесплатный курс по React JS. Тут даже подтягивается нативный JavaScript
после вчерашнего занятия, закрепил свое понимание HOC'а, теперь я мастер по HOC'ам, спасибо, Димыч))
Летим, бро!!!
Очень интересно Димыч, блин у тебя талант учить, ты понятно рассказываешь, но фишка у тебя в другом, бешеная харизма)
React, HOC - летим дальше. Мозг местами взрывается, но идем дальше. Очень уж хочется стать React-самураем!!!))) Димыч красава, как всегда!! Спасибо!
Вчера после санок трудновато было переварить, сегодня зашло как к себе домой. Спасибо Димыч, ты лучший Сэнсэй!)
ТОП среди курсов по ReactJS. Легкое, по-семейному теплое, объяснение High Order Component.
Лучшее введение в hoc.
HOC знал чуть-чуть, сейчас стало яснее намного, прямо стал понимать, урок вышел действительно интересным. Очень нравится, что есть возможность создавать такие конструкции. Да, сложно, но это одновременно и круто))) Летим
Спасибо! High Order Component (hoc) - очень полезная штука!
HOC high order component
Очень понятно и доступно.
Димыч, спасибо)
High Order Component (hoc)!! Круто, спасибо за видос!
High Order Component (hoc)
Все круто, летим дальше!)))
High Order Component - best of the best)
Блин Димыч я спать не могу пойти, так всё интересно. Ты просто как сенсей-самурай ведёшь меня через туман React и своей катаной расфигачиваешь эту пелену непонимая технологий. Спасибо... то есть Аригато!)
Мозг взорвался, но как же было интересно!
Спасибо за такой крутой курс =)
HOC (Hide order companent) Отлично видео, Спасибо Димыч!
Первый раз посмотрел и ничего не понял, решил передохнуть пару дней. Посмотрел сейчас и оказывается все просто и понятно) Спасибо Димыч! 21 год, полёт нормальный)
И тут я понял, что придется пересматривать) не понял все с первого раза, впервые за 69 видосов)
Димыч привет! Взрыв мозга конечно был), но не масштабный)!! Уверенно прём-летим дальше!!
Огромное спасибо!!!
От прошлых тем прям очко пригорало, много багов фиксил, а здесь зашло как по маслу. Спасибо Димыч, на 100 выпуске обязательно донат!
Спасибо за урок! HOC high-order component
React JS - High Order Component (hoc) спасибо за выпуск
как же круто понимая теорию перед кодингом Димыча писать код и потом сверять, настоящая камасутра 🚀🚀🧑🏻💻🧑🏻💻
hoc взрывает мозг=)) спасибо большое!!!
если этот человек перезапишеет путь саммурая с современным стеком - однозначно он будет самым знаменитым в этой сфере в руссом сегменте)
а смысл, синтаксис в пакетах меняется чаще, чем выходят гаджеты от сяоми))
High Order Component (hoc) - спасибо за урок!
Взрыв мозга, High Order Component (HOC) - для меня самый сложный пока урок, прямо жесть. Но после комментов я была к этому готова)) Эх, пересматривать и пересматривать...
Спасибо за классный курс!)
Первую часть про HOC понял, потом поплыл))) Буду возвращаться.
Сегодня 4я неделя моего пребывания джуном. Все супер, есть пару менторов, все очень сложно и абсолютно не так как на курсках, уроках, но твои видосы, Димыч, приблизительно показывают что происходит в проектах, и это очень хорошо. hoc. hook, husky - c этим всем знакомлюсь только только... но реально видосики помогают.
как ощущения?
@@bigenough2122 Ну уже могу поспорить иногда с мидлами и даже с синьорами, качать надо хуки, тут сейчас никто из синьоров в них не синьор, и можно "учить" синьоров, получая от них какието взаимные плюшки в виде объяснений или лояльного отношения. Да и нет уже джунского мондаража при решении каких то тасок. чувствуешь себя более спокойнее.
@@MaxKievSky а до этого бекграунд был?
@@bigenough2122 С разработкой почти нет, флеш, и небольшая корректировка скриптов по типу ActionScript, да и пару курсов прошел, но learn.javascript помогло еще разобраться с некоторыми вещами, там есть обсуждение читателей. их тоже нужно читать. Ну и книги. чем больше тем лучше.
@@MaxKievSky а реакт как учил, и как долго путь твой длился?)
Было трудно, но смысл понятен.. надеюсь глубокое понимание придет со временем!
HOCs сила! Не зря последовал совету Димыча и перед просмотром почитал теорию + просмотрел пару уроков по хокам. Теперь они выглядят не так страшно как при первом знакомстве :D
Спасибо => полетел дальше! React JS HOC = power!
Nice job , thx Dimasta! HOC , Redirect, classComponent ,block UI, login.
Большая благодарность за уроки!
(High Order Component)
В принципе это видео зашло и с первого раза, но смотрел я его 80 минут, я просто всё что нужно записываю, поэтому так вышло)))
Давай сенсей Димыч ждьомс новых видео по Reac-у ))
Красавчик что сделал этот курс)
Отличный урок. React JS - High Order Component (hoc)
У меня нет подходящих матов чтобы выразить благодарность и восхищение! Конечно, я только к 60-му видео начал понимать подачу материала. Но блин...оно этого стоит! 30.06.2023 -> #React-#Redux
ты прошел весь курс? нашел работу?
@@midnightstar_zoriana ага)) два раза))
я наткнулся на такой феномен "выученная беспомощность". Понял, что по меньше видео, по больше практики.
Лайк! Хок отличная тема, все получилось едем дальше.
HOC - это не взрыв мозга, а высокоскоростная карусель. К концу урока мозг сделал 1000 и 1 оборот вокруг своей оси, и послал меня, сказав: "Отвали, братан, меня укачало и я хочу вздремнуть". Но ничего. Загляну попозже в этот "Экстрим-камасутра-парк". React рулит!
Спасибо большое! HOC круто разобран. High Order Component.
HOC, high order component, React , React&Redux! Сложновато, но все понятно, уверен следующее видео поможет распутать HOC hell !
React JS
High Order Component (hoc)
Спасибо за урок
Вроде понятно, спасибо за видео!:)
HOC High Order Component
High Order Component (hoc), круто очень, бомбим дальше!
Как всегда на высоте!
Последовал совету Димыча и перед этим выпуском прочел докуминтейшн. В итоге, уже имея представление о High Order Component пришел смотреть видос! Можно сказать, Димыч, привел в порядок мои неотесанные знания о HOC. Спасибо!
то чувство, когда redux-thunk & hoc заходят намного лучше, чем постраничный вывод и button disabled)
промисы посложней всего этого, просто нужно не торопиться, я понял урок с disabled и постраничным с первого раза. Что бы не запутаться в этом всем, просто иногда нужно облокотиться на кресло и в тишине задуматься о этом коде, который там написан, в голове все промотать, возможно полежать, переварить, я лично беру спинер, смотрю на него и собираю все в голове, помогает сосредоточиться, я это запомнил и могу смело использовать в будущем.
HOC не знала ранее, но очень понравилась эта функция, так как она упрощает код и его понимание . И понравилось то, что контейнерная компонента отрисованная функцией HOC - относительно, временная #hoc #HighOrderComponent #КомпонентВысшегоПорядка #reactjs #практика #примеры #уроки #курс
Пытался понять эти HOCs, зачем и когда их использовать. Только на примере понял смысл HOC -ов и причину использования. Спасибо Димыч!
Спасибо! Главное всегда успевать поставить лайк до того как взорвётся мозг и разлетится по комнате.
hoc шикарен, плюсик для лучшего ранжирования! =)
Мозг не взорвался , но было интересно и понятно. Круто топим дальше Димыч. Успехов тебе и удачи!!!
Отличный урок, дружище. Твой курс помог мне сменить профессию строителя на фронтенд разработчика. Сейчас я джун в хорошой айти-компании. Набираюсь опыта на работе и подсматриваю некоторые фишки у тебя. Я обязательно тебя поддержу с первой зарплатки) не бросай этот курс.
Поздравляй, бро!!! И спасибо!!!! 🙏 скоро второй сезон!