Мало того, что все доходчиво и в деталях объяснил, так еще и грамотной речью и с четкой дикцией! Я в восторге от автора!
@kulikboxx3 жыл бұрын
Гений чистой красоты! Снимаю шляпу и аплодирую стоя! Плейлист по реакт-хукам просто бомба! Спасибо тебе огромное, добрый человек!
@vadim96343 жыл бұрын
это лучшее что я видел о этом хуке ,спасибо
@ВладОся-з7ь5 ай бұрын
как я обожаю когда человек который учит угадывает мысли человека как бы он сделал и как надо делать , продолжай в том же духе , очень полезно )
@Дмитрий-б5в3 жыл бұрын
Я в проде работаю более полугода и до этих пор не понимал до конца хуки, смотрел кучу видосов по хукам, но это видео оказалось самым внятным и самым разборчивым.
@ВадимХаликов-н2е2 жыл бұрын
В компании?
@lovikuanyshev2 жыл бұрын
Спасибо огромное за такое классное объяснение! Мне понравилось, что ты первую часть урока посвятил тому как решить проблему используя "костыли" и другие похожие инструменты, а потом уже показал как правильно делать, и еще тот момент, что ты детально описываешь поведение компонента через все жизненные циклы так информация очень хорошо усваивается, максимально доходчиво!
@unknown.6914 Жыл бұрын
Прекрасный урок, спасибо
@sviatbondar17212 жыл бұрын
Просто без лишнего, и такие мелочи не везде узнаешь. Спасибо!!
@AmirLT-x6y Жыл бұрын
Thaks. All iš very clear. No questions. It is the best video about useEffect🎉🎉🎉🎉🎉🎉🎉🎉
@11wingsofdeath Жыл бұрын
Благодарю ❤ очень круто объясняешь механику
@Virisound2 жыл бұрын
Коммент в поддержку видео: "Даaa..., отличная работа".
@ВладиславМаслов-л7ж4 жыл бұрын
Супер полезное видео, спасибо за труд!
@ValentinTayursky2 жыл бұрын
Спасибо за объяснения. Весьма полезное видео!
@blackwood8816 Жыл бұрын
Как же все подробно и доходчиво объяснил, благодарю 🙏
@ВладимирГугин-ш7щ3 жыл бұрын
На 6:10 уже сам реакт намекает нам Assignments to the 'ultElem' variable from inside React Hook useEffect will be lost after each render. To preserve the value over time, store it in a useRef Hook and keep the mutable value in the '.current' property. Otherwise, you can move this variable directly inside useEffect react-hooks/exhaustive-deps
@bur51534 жыл бұрын
1)Нужно для того что бы достучаться правильно до дом элемента, и повесить на него обработчик событий или достучаться до какой либо функции этого элемента(audio,video(play,pause и т д.) 2)Нужен для того что бы хранить актуальные данные из переменной(на которой есть useRef), так как при рендере компоненты ссылка на актуальную переменную теряется
@drewnaumenko24693 жыл бұрын
" повесить на него обработчик событий " ну вот немного непонятно именно в каких случаях делать так как в видео а в каких console.log('scroll')}>
@kava6483 жыл бұрын
@@drewnaumenko2469 в теории, если тебе не нужно будет, скажем, в дальнейшем удалять обработчик, то можно и просто добавить onScroll
@drewnaumenko24693 жыл бұрын
@@kava648 кстати хорошая тема поднялась Когда мы через атрибуты обработчики навешиваем мы и никогда их не удаляли. например onClick или любой другой евент. Click и всё; мы же не удаляем обработчик мы вот так на кнопку обработчик навесили и всё почему со скоролом мы должны удалять?
@AndreyEricksonGame3 жыл бұрын
@@drewnaumenko2469 Как я думаю, мы должны удалять обработчик события - 'скролл', как ни странно, чтобы отменить это событие скролла. Потому что пока мы не удалим прослушку события, то логично, что событие скролл никуда не денется и callback внутри addEventList будет вызываться при каждом скролле. Надеюсь ответил на ваш вопрос
@drewnaumenko24693 жыл бұрын
@@AndreyEricksonGame ну это если мы его навешиваем через addEventListener , а если через атрибуты? точно не знаю но через атрибуты React под капотам сам чистит всё, видимо так.
@DzhavidR4 жыл бұрын
круту, круто! Спасибо. Давно ждал по хукам видео именно от тебя, именно потому что хорошо объясняешь. Надеюсь и по остальным хукам будет видео, в частности useReducer вообще туго дается
@alexandrzhuykov73552 жыл бұрын
Самое крутое объяснение этого хука!!! СПАСИБО!!
@МасияГусейнов-ъ5е4 жыл бұрын
Будь здоров ! Спасибо !
@MAKSIMTSA Жыл бұрын
Круто! НАконец-то все понял. По полочкам разложил!)
@СеитханРискельдиев3 жыл бұрын
Супер. Круто объясняешь. Продолжай
@alexrybalov89173 жыл бұрын
Это видео меня спасло. Благодарю.
@daryaemelyanova1785 Жыл бұрын
Очень наглядно и пример хороший 👍
@volodya_kod68 ай бұрын
Спасибо мужик, все стало понятно!
@AleksandrKovalchuk-z8m4 жыл бұрын
Привет. Спасибо за отличный материал!
@Poziratelb4 жыл бұрын
Как раз вожусь с ними. Дают много возможностей
@nikitakurochka27524 жыл бұрын
Очень крутое видео. Долгое время мучали вопросы по этой теме) А тперь все пушка !!
@БауржанКадискалиев4 жыл бұрын
Спасибо большое за подробный материал
@bohdanshyrii23808 ай бұрын
спасибо мужик! очень помог!
@br_ann Жыл бұрын
Спасибо за объяснение!
@crypto4elik Жыл бұрын
очень ясно! спасиб!
@romankhudovekov51454 жыл бұрын
Благодарю за полезное видео!
@wither-it-channel Жыл бұрын
лайк не глядя
@olegbukovskiy7484 Жыл бұрын
Благодарю, было полезно 👍
@strel94 жыл бұрын
сделай видос собеса на Джуна на Реакт, может одного или нескольких подписчиков (или как вариант вакансию на HH разместить), думаю будет популярный видос
@-web23784 жыл бұрын
Думаю нет
@ultraduck1004 жыл бұрын
@@-web2378 ну да, все же сразу на мидла или сеньера идут
@-web23784 жыл бұрын
Ruslan Nagiev тут не в этом дело. Либо ты идёшь и проходишь собеседование на джуна, либо ты сидишь и смотришь видос на ютубе. Если человек хочет найти работу, в частности джуна, то он берет и идёт и ползёт на собеседование. А у вас получается другой подход, который называется «Сижу смотрю видос про собеседование джуном, но на джуна не пойду ещё года два» . И чем больше вы ждёте такой ролик, тем больше вероятность того, что вы будете джуном, который так и не пойдёт на собеседование, но будет с удовольствием переносить все тяготы и невзгоды через другого, точнее через того, который видос этот снимет. Вот и вывод, что вам легче посмотреть видос по собеседованию часа на два, чем сходить и самому пройти эти собеседования.
@strel94 жыл бұрын
Нукат - web так то же самое и про мидла сказал можно😂 про любое собеседование😂
@ultraduck1004 жыл бұрын
@@-web2378 да, это логично и я с вами согласен, НО речь то шла о популярности такого видео) я думаю, каждый (или большенство) хоть раз да и пытался найти такой формат видео. так что автору довольно выгодно должно быть в плане просмотров. я уверен, что самые популярные видео на этом канале именно собесы. это можно легко проверить
@strel94 жыл бұрын
лукос не глядя, какраз хотел с useRef разобраться
@ВладиславКильчевский-к5ц3 жыл бұрын
Переписывал следом за тобой до таймеров, и не понимал, почему у меня нет в логах сообщения о скролле, спустя минут 30 допер что без css стилей таких же, он не фиксируется ) Видосы крутые!
@xmarsianca2 жыл бұрын
Прекрасное объяснение!! Спасибо!
@YevhenHromov Жыл бұрын
Спасибо огромное за урок! По мере прохождения появился вопрос) Если запустить таймер несколько раз подряд, создадутся разные ссылки (разные айди таймеров), и остановить уже просто по первой ссылке все таймеры не выйдет. Как обойти эту проблему? можно ли иметь доступ к каждой новой созданной ссылке поочерёдно или нужно как-то избегать пересоздания новых ссылок. Пока писал, понял, что ответ где-то в районе меморизации или useCallback'a)
@ruslankarimov6490 Жыл бұрын
спасибо!!!
@challengetolearnenglishfor98237 ай бұрын
Thank you very much
@dimags5002 жыл бұрын
Очень хороши ваши уроки , спасибо
@alexsandr94444 жыл бұрын
Круто объясняешь, давай про остальные хуки
@skeelo31573 жыл бұрын
В примере с массивом чисел так же бы сработал useMemo?
@kenanhaciyev3759 Жыл бұрын
спасибо
@BeDb_MeDb3 жыл бұрын
Привет, прошу прощения. Вы сказали, на 11:50 примерно, что нельзя в глобальную область выносить. Я подключаю модуль с сокетами, подключить его в функции ясно что не могу. Потом я использую этот сокет в функции. Вопрос: что я делаю не так? (сейчас по Вашим видео пытаюсь понять, думаю, что моя ошибка как раз в неправильном понимании того, что эти хуки есть такое) Однако, если я сейчас в правильное место не вынесу подключение сокета и не налажу это все грамотно - задолбаюсь дебажить (по чесноку уже задолбался:-D) Большое спасибо за внимание.
@kseniazh17383 жыл бұрын
Спасибо за отличные примеры!!! Вопрос: хранение данных в созданном объекте Ref напоминает создание глобальной переменной с хранением в useRef. Можно ли к созданному объекту Ref в одном файле обращаться из другого файла? Типа как брать/менять данные из Redux? Если да, то как это сделать и влияет ли подчиненность/очередность создания документов? Или Ref работает только здесь и сейчас? Т.е. без перезагрузки ушли из формы в другую, объект исчез. Вернулись - счетчик обнулился, создался новый объект, снова нажимай на кнопку?
@ArchakovBlog3 жыл бұрын
Можно использовать useContext, если нужно прям глобально с ним работать или прокинуть в пропсы этот реф, чтобы передать его дальше. Реф работает только в конкретном компоненте, как useState, например.
@tatyanamaksymenko2894 жыл бұрын
Благодарочка!)
@akhmedmagomedov3242 жыл бұрын
Пожалуйста обьясните как в current попала цифра 4, и почему она растет если запускать таймер?
@aliaksandrjanuary53053 жыл бұрын
В последнем примере также можно было не прибегать к ref сохраняя таймер в стейте используя useState. Мне кажется конкретно для такой задачи это более уместное решение.
@TheMaratnasyrov3 жыл бұрын
тоже интересует. почему бы для этого не использовать useState, в чем плюсы и минусы такого решения?
@ArchakovBlog3 жыл бұрын
Почему уместней юзать там setState? И почему useRef не подходит?
@serg12213 жыл бұрын
великолепно
@bubinbei3 жыл бұрын
ul { height: 150px; overflow: auto; } необходимо добавить это css свойство, иначе скрол не будет отрабатывать
@СвириденкоВолодимир-х1с3 жыл бұрын
Ценю тебя мужик!
@dinmukhammedtleuzhanuly12252 жыл бұрын
Спасибо, за крутое обьяснение)
@wittyvillain2 жыл бұрын
Хороший пример! А как сделать чтобы скролл автоматически опускался в конец списка?
@apa63684 жыл бұрын
Салам алейкум, расскажи про useContex, самая запутанная, как по мне, тема
@Witcher-simple-YouTube Жыл бұрын
Очень хочется в твоей подаче послушать про mobx
@ALEKSEY_777373 жыл бұрын
отлично!
@DzhavidR4 жыл бұрын
а что у тебя за тема VSCODE? понравилось как отображаются стрелки в стрелочных функциях
@DzhavidR4 жыл бұрын
если кому интересно, то это не тема была, а лигатуры, нашел Fira Code github.com/tonsky/FiraCode
@privatehost71174 жыл бұрын
Изыди, демон, с белой темой
@ВсеволодЗорин-л6н3 жыл бұрын
@@privatehost7117 не бурчи,! всё збс! не переживай, скоро ты поймёшь почему именно так ;)
@petrmurashko68842 жыл бұрын
Где найти шрифт со значком => для VS code?
@ОлегОвчинников-щ9с Жыл бұрын
🔥🔥🔥🔥🔥🔥🔥
@frontman68494 жыл бұрын
ну почему? ну почему белая тема?
@adam-front2 жыл бұрын
Ночью надо спать!
@amelianceskymusic2 жыл бұрын
Согласен, жесть
@localhost666 Жыл бұрын
Наоборот отлично, не режет глаза при переходе от IDE в браузер
@snakevenom8039 Жыл бұрын
иди наҩӱйӣ😅
@frontman6849 Жыл бұрын
@@snakevenom8039 неа
@АлександрСосо-щ1б2 жыл бұрын
Приветствую! Спасибо за урок! только не понятно, может ли быть несколько useRef внутри одной компоненты для выполнения разных задач, или свойство current одно на компоненту?
@ArchakovBlog2 жыл бұрын
Если разные задачи, то вполне может
@cradleofkaschenko20573 жыл бұрын
Про сам хук начинается с 12:00. Революционный подход!
@alexsedmoy2200 Жыл бұрын
👍👍👍
@westside91454 жыл бұрын
Где можно посмотреть характеристики твоего компьютеа, было бы здорово увидеть видео про твоё рабочее место и пространство
@eugenegavrilov26184 жыл бұрын
как это поможет с изучением react'a?
@westside91454 жыл бұрын
@@eugenegavrilov2618 брат, мир шире чем "изучение реакта"
@eugenegavrilov26184 жыл бұрын
@@westside9145 согласен, но ты задал вопрос в коменете, под уроком на рекате)
@Mark1-f2n4 жыл бұрын
братан ждем про useCallback от тебя
@MarinYehor4 жыл бұрын
Денис, подскажи, я не понял последнее с setInterval 1) почему timerRef.current хранил в себе число 4? 2) А так же почему нужно было добавлять в функции addNumber prev state? Разве при вызове addNumber не меняется state и уже при следующем вызове addNumber не должно ли логически браться новый state с добавленным числом? Ведь происходит ререндер и данная функция addNumber уже должна получать актуальное значение state Спасибо за выпуск, целую тебе руки)) Жду useCallback видео с нетерпением
@dimeliora4 жыл бұрын
1. useRef создаёт объект с полем current. Далее мы можем его использовать для сохранения любой информации и быть уверенными, что она не потеряется при перерендере. setInterval при вызове возвращает номер запущенного таймера, он нужен для того, чтобы потом этот таймер сбросить (clearInterval принимает номер таймера, который надо сбросить). Если его не сохранить, то сбросить таймер после не получится. В данном случае таймер вернул номер 4, его и сохранили, а потом использовали для сброса. 2. Документация гласит, что если новое состояние зависит от старого (всякие коллекции, счётчики и т.д.), то правильно будет в функцию обновления state отдавать колбек. Этот колбек примет аргументом актуальное значение state, и на его основе мы создаём новое.
@ДанилоНовосад-ь7х4 жыл бұрын
Спасибо, а как ты сделал плавный курсор в vs code?
@DzhavidR4 жыл бұрын
Зайди в настройки vsCode - в поиске набираешь курсор - и выбираешь Editor cursor blinking: expand
@dychkos3 жыл бұрын
Большое спасибо за информативное видео!
@michaeldevichenskiy45883 жыл бұрын
Где у вас учиться , ну или как ?
@user-bo7mb9cf4d4 жыл бұрын
Топ!
@abobus_xero4 жыл бұрын
Почему у меня не выполняется функция handleScroll при прокрутке,но с обычным кликом все работает. Все сделано как на видео?
@ПродюссерЛетов3 жыл бұрын
Привет, прошло 8 месяцев, ты решил проблему?
@abobus_xero3 жыл бұрын
@@ПродюссерЛетов честно уже не помню, гуглил и понял почему, но на данный момент с этим не было проблем больше
@ПродюссерЛетов3 жыл бұрын
@@abobus_xero понял, спасибо за своевременный ответ!
@darkside24364 жыл бұрын
Когда 8 часть по клону твиттера?
@miloman1995s4 жыл бұрын
учил полгода реакт, взяли на vue..... подскажите че посмотреть типо этого канала но по vue.... спс
@kawaikaino52774 жыл бұрын
Ахаха)) забавно
@jorgenUA4 жыл бұрын
доку читай, она хорошая - быстрее будет
@alienspro4 жыл бұрын
Смени работу на реакт, ониперспективнее в разы. А для хорошего дохода только Angular. Очень юольшие корпоротивные приложения только га Angular последнее время делают. Nest.js еще сильнее популяризирует это.
@miloman1995s3 жыл бұрын
@@kawaikaino5277 забавно то, что выучил vue , писал на нем с кайфом 8 месяцев, щас опять нужен реакт, снова вспоминаю и переучиваю react) вот это забавно
@ggadoctb Жыл бұрын
Каждый, кто посмотрел данный плейлист, искал медь, а нашел золото)
@romanpetrashkevich52923 жыл бұрын
Нужно немного поправить метод start, для защиты от множественного нажатия на кнопку старт. const start = () => { if (timerRef.current) { clearInterval(timerRef.current); } timerRef.current = setInterval(addNumber, 1000); };
@Wazelinchik4 жыл бұрын
Теперь есть чем заняться в 2 часа ночи.
@MadBlissOff3 жыл бұрын
Что за клавиатура? Такой звук клавиш приятный, прям не могу
@bukanaka3 жыл бұрын
Может механика с голубыми свичами
@MadBlissOff3 жыл бұрын
@@bukanaka у голубых свитчей щелчок есть, а тут его нет
@Mike-hp3fh4 жыл бұрын
В svelte все, что есть в React сделано в 100 раз проще. Но приходится учить React, т.к. он есть везде, а о svelte еще мало кто знает.
@samolevich Жыл бұрын
Так много магии
@Mike-hp3fh4 жыл бұрын
Очевидно, что если в компоненте использовать несколько React.useRef и вызывать их в случайном порядке, или просто не в строго определенном порядке, то все полетит к чертям. Новички конечно об этом и не подозревают.
@theBarracuda_3 жыл бұрын
Из-за чего?
@Mike-hp3fh3 жыл бұрын
@@theBarracuda_ из-за того что при таком подходе (я имею ввиду возможности JavaScript которые использует React) это единственный способ связать данные с кодом. На каждом вызове useRef увеличивать внутренний счетчик на 1 и брать следующий из объект из внутреннего массива.
@alexeystaroverov48043 жыл бұрын
Scroll всегда неудачный пример там куча нюансов не связных с целевой функцией
@АрчибальтГугенов Жыл бұрын
очень запутанный пример
@someguy49732 жыл бұрын
"Но это не есть хорошо, мы должны использовать нормальное решение". Далее автор использует "нормальное решение", не объяснив а почему все же "это не есть хорошо", потому что видимо сам не разобрался в этом вопросе.
@harrisonwinston28502 жыл бұрын
а что тут разбираться? React рекомендует работать со своими инструментами, не используя DOM-манипуляции напрямую, чтобы не конфликтов с ним.
@Калабарака Жыл бұрын
ничего не понятно вообще
@Mike-hp3fh4 жыл бұрын
Госспади какой же ужас этот React
@Liver_Room8 ай бұрын
видео явно для полных нулей ато обясняют так будто мы обезяны безмозглые