Адаптивное бургер меню на React JS. Переиспользуемое выезжающее меню на React js

Рет қаралды 59,743

3 жыл бұрын

В этом уроке мы сделаем адаптивное, переиспользуемое бургер меню.
Ссылка на этот плейлист -
• ReactJS компоненты
React + Redux + Webpack
• React Redux Webpack - ...
Анимации в React -
• Анимации в React. Reac...
Разработка fullstack MERN web приложения
- Frontend - • Playlist
- Backend - • Playlist
- Fullstack - • MERN - FullStack разра...
Поддержать меня и мой канал вы можете по ссылкам ниже.
Qiwi кошелек - www.qiwi.com/n/BODYE821
Яндекс деньги - yoomoney.ru/to/4100116193037469

Пікірлер: 80

@user-ix9sx5og4s 3 жыл бұрын

Уже какой раз ищу что-нибудь в ютубе и тут ваш канал), спасибо, очень выручает)

@aleksandriero1283 2 жыл бұрын

Спасибо большое, очень кратко и максимально по фактом, без воды и заминок, вы мой герой, без Вас бы не разобрался

@user-ce2fs2gz6f 3 жыл бұрын

как обычно, очень полезное и краткое руководство! Спасибо

@user-xl7gq5vs9f 3 жыл бұрын

Какой же топовый канал ! Вот блин, что не загуглю, какой бы вопрос не задал, всегда этот канал вылазит) Пасиб за ценную инфу❤️

@UlbiTV 3 жыл бұрын

Очень рад слышать! Спасибо!

@user-mh4vy2gd3y 2 жыл бұрын

В очередной раз превеликие благодарности тебе) по сути теперь с этим пластилином можно будет сделать что угодно, а основу ты задал. Спасибо!)

@user-sd9je7ov8o Жыл бұрын

Максимально полезно! Как раз дали задачу запилить компонент выпадающий фильтр. Спасибо, Тимур! Пока смотрел ролик количество подписчиков увеличилось с 132к до 134к! Пусть также и дальше растёт! Желаю от всей души)

@Quentinrei 2 жыл бұрын

очень крутой контент, прям глаз радуется когда у тебя подписчики растут

@posmotrel333 Ай бұрын

Тимур,спасибо тебе,твои видео вдохновляют,весь ютуб перелазил и забыл что есть гений.

@fullname9437 3 жыл бұрын

Посмотрел твои плейлисты и скажу, что они очень хороши не только для новичков, но и для продвинутых разрабов. Как уже многие писали - минимум воды. А это очень важно, когда времени в обрез. Продолжай в том же духе.

@aleksandrsaponchyk4474 2 жыл бұрын

Спасибо! Все по существу и без воды! 👍🏻

@user-br1tu9xh4w Жыл бұрын

Огромное спасибо за урок, очень-очень полезно и доступно.

@yevgenilagno5219 Жыл бұрын

Гений 👌🏻💪🏻 лучшие видео из всего ютуба

@barbatage5078 3 жыл бұрын

Спасибо за ваш труд! Бесценно!

@UlbiTV 3 жыл бұрын

Спасибо. Приятно!

@SanchirEmgushov Жыл бұрын

Cижу в 2023 и смотрю это видео, какой же у Тимура качественный контент)

@alexalex-zh4ep Жыл бұрын

спасибо. Как всегда по теме. Коротко и ясно.

@vladyslavfx3892 3 жыл бұрын

Для поддержки канала)) Давай серию уроков про jest, тестировать можно одно из тех приложений что ты делал в предыдущих видео. Думаю многим будет актуально.

@kirillshapovalov495 3 жыл бұрын

Крутое и полезное видео! Спасибо!

@UlbiTV 3 жыл бұрын

Спасибо!

@skily4866 2 жыл бұрын

Спасибо огромное!

@user-tg3bj1vu9i Жыл бұрын

Твои плейлисты очень полезны и скажу, что они очень хороши и максимально полезны для всех! Вопрос можно сделать полосу заполнения данных в конкретной созданной форме в React/

@mszulya4100 2 жыл бұрын

Спасибо!

@blgarOk 2 жыл бұрын

Спасибо за годный контент. Стор пропагиНэйшн улыбнул)

@user-qm6pu1bl9n Жыл бұрын

Большое спасибо!!!

@No-kq9rq 3 жыл бұрын

афигенский контент!!!!!

@UlbiTV 3 жыл бұрын

Спасибо!)

@makeoverweb2663 3 жыл бұрын

отличное видео.Интересно было бы посмотреть про typescript. Именно показать его мощь(не только типизация пропсов).

@UlbiTV 3 жыл бұрын

Будут видосы про тайпскрипт!)

@user-tc1qq5nm3x Жыл бұрын

спасибо :)

@user-vc6mo5nl8g 2 жыл бұрын

так быстро что ппц...неугнаться....

@xela_8746 2 жыл бұрын

Тим, ну пишу из 21 го года, спасибо за видос, ты меня на мысль натолкнул, еще бы радиальное меню показал)))

@Max-kr4ie 3 жыл бұрын

посмотрел, хорошее виде, для новичков самое то.

@UlbiTV 3 жыл бұрын

Ты прям решил все мои видео осилить, красавчик))

@sergeikirillov1127 2 жыл бұрын

Thanks!

@MrVertu01 2 жыл бұрын

Рили интересно

@user-bo7mb9cf4d 3 жыл бұрын

Быстро чётко

@UlbiTV 3 жыл бұрын

Спасибо!)

@artempavlenko5147 3 жыл бұрын

Круто и полезно ! #react #burgermenu

@UlbiTV 3 жыл бұрын

Спасибо друг!)

@Ramosok 2 жыл бұрын

FullName согласен!

@Vlad-us9xt 3 жыл бұрын

top!

@UlbiTV 3 жыл бұрын

thx

@user-yn5sq1fd5e 3 жыл бұрын

очень полезное видео, у самого получалось не правильно как-то)

@UlbiTV 3 жыл бұрын

Спасибо за отзыв!

@itpro952 3 жыл бұрын

Спасибо за видео. Продолжение курса по nodejs и реакту будет? Закончить хочется

@UlbiTV 3 жыл бұрын

Продолжение будет 100%. Приложение до логического завершения мы доведем, на днях будет новый ролик)

@makeoverweb2663 3 жыл бұрын

еще интересная тема в тестировании BDD. Codecept + Puppeteer

@user-pc5kc7cc5r 3 жыл бұрын

Чувак ты спас мою карьеру))) я джун

@UlbiTV 3 жыл бұрын

Хеех) Успехов!

@qwe-rty- 2 жыл бұрын

Подскажите, как поступить со скроллбаром при overflow: hidden;

@jamjam3337 Жыл бұрын

👏

@user-os2oo3oq9e 3 жыл бұрын

Спасибо за интересный контент! Есть такой вопрос: тут на body не навешивался overflow: hidden для блокировки скролла страницы. Если всё-таки нужно будет заблокировать скролл при открытии меню, то как правильно обратиться к body в React? (вроде бы как в Реакте считается нехорошо обращаться к элементу через document.querySelector)

@anazkomult 3 жыл бұрын

Просто обращаемся к боди, не нужен никакой querySelector document.body.style.overflow = "hidden"; когда меню скрывается, возвращаем скролл: document.body.style.overflow = "visible";

@user-pm8en7be4w 2 жыл бұрын

Хорошо бы исходник . Если не жалко конечно.

@roxydevil1 3 жыл бұрын

в ролике не корректно показали откуда взялись иконки. Подключили не тот CDN

@antonkudrin7060 3 жыл бұрын

Все очень круто) но очень быстро как по мне )

@UlbiTV 3 жыл бұрын

Стараюсь не затягивать ролики, спасибо за отзыв!)

@gulik5048 3 жыл бұрын

А как это заанимировать?

@agsmith899 Жыл бұрын

0:24 "мы здесь не дизайном занимаемся" - можно смело переименовывать канал)))

@mikhail_shokun 2 жыл бұрын

Ulbi, все чётенько, приятно слушать. PS уже не раз замечаю что ты говоришь стоп пропаГИнэйшн, а не стоп пропагэйшн)) (я не со зла, просто прикольно) kzfaq.info/get/bejne/hJZ8iq-cxrDeYX0.html

@libertariancom 9 ай бұрын

Просто проф сдвиг из-за пагинации

@miangel0 3 жыл бұрын

а можно где-то архив проекта найти, а то есть ошибка: 'active' is not defined и я не понимаю как ее исправить, хотелось бы на код взглянуть

@UlbiTV 3 жыл бұрын

К сожалению в данном уроке нет, не загрузил никуда исходный код. Проверьте переменную active, ее не видно

@Iamthelola 2 ай бұрын

вы пишите код в visual studio code?

@user-ot2vu1bq9g Жыл бұрын

Класс! Еще бы текст проекта куда-нибудь выложить или ссылку на ГитХаб приложить, если выложен. А то с экрана неудобно искать нужные фрагменты.

@Djuslun Жыл бұрын

Не могу никак понять как закрывается меню при нажатии на ссылку, stopPropagation должно ведь помешать закрыть меню при нажатии на все что внутри блока

@libertariancom 9 ай бұрын

У тебя другой url открывается, это основа роутинга, ты нажимаешь на ссылку - у тебя компоненты перерисовываются с новым url, поэтому и закрывается

@vagoalex13 2 жыл бұрын

Есть вопрос, что если nav секция изначально без бургера, а при определённой ширине становится бургер. Как здесь подключать компонент? В хедере, где будут лежать nav и adaptive nav сделать стейт, и записывать в него ширину при изменении размера экрана? И исходя из этого стейта уже вызывать компонент?

@ea5970 3 жыл бұрын

ппц насколько же Vue легче

@UlbiTV 3 жыл бұрын

Вью конечно полегче, но не сказать что прям сильно, дело привычки)

@anazkomult 3 жыл бұрын

Мне реакт наоборот легче дался, меньше магии, понятнее как все работает...

@zloy_ax8496 3 жыл бұрын

+++

@UlbiTV 3 жыл бұрын

++))

@yankov2206 Жыл бұрын

а про key для map не слышали...

@user-yo1vu7vl2r Жыл бұрын

Дружище помоги пожалуйста, у меня ошибка и всё никак не могу понять в чем дело((( Отпиши пожалуйста,,,

@tutor2024 2 жыл бұрын

Про адаптивность только последняя минута видео. Первые 12 минут зря смотрел. За это дизлайк.

@schroedingerscat6810 Жыл бұрын

Один вопрос? если ты знал всё до последней минуты, зачем ты сюда зашел? узнать про @media?

@schroedingerscat6810 Жыл бұрын

просто не понимаю зачем свой рот открывать. я бы понял если бы код не понравился или что-то подобное. или вообще ничего не работает. начни свой Ютуб проект по верстве я с удовольствием посмотрю на правильные видео. А то может я тут зря на тебя наехал

@libertariancom 9 ай бұрын

А тебе надо было 50 минут адаптивности?)) Ну и кринж