Адаптивное бургер меню на React JS. Переиспользуемое выезжающее меню на React js
HTML-код
- Опубликовано: 19 сен 2020
- В этом уроке мы сделаем адаптивное, переиспользуемое бургер меню.
Ссылка на этот плейлист -
• 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 
Наука
Посмотрел твои плейлисты и скажу, что они очень хороши не только для новичков, но и для продвинутых разрабов. Как уже многие писали - минимум воды. А это очень важно, когда времени в обрез. Продолжай в том же духе.
Спасибо большое, очень кратко и максимально по фактом, без воды и заминок, вы мой герой, без Вас бы не разобрался
Уже какой раз ищу что-нибудь в ютубе и тут ваш канал), спасибо, очень выручает)
Какой же топовый канал ! Вот блин, что не загуглю, какой бы вопрос не задал, всегда этот канал вылазит) Пасиб за ценную инфу❤️
Очень рад слышать! Спасибо!
как обычно, очень полезное и краткое руководство! Спасибо
Максимально полезно! Как раз дали задачу запилить компонент выпадающий фильтр. Спасибо, Тимур!
Пока смотрел ролик количество подписчиков увеличилось с 132к до 134к! Пусть также и дальше растёт! Желаю от всей души)
В очередной раз превеликие благодарности тебе) по сути теперь с этим пластилином можно будет сделать что угодно, а основу ты задал. Спасибо!)
Спасибо! Все по существу и без воды! 👍🏻
Огромное спасибо за урок, очень-очень полезно и доступно.
Спасибо за ваш труд! Бесценно!
Спасибо. Приятно!
очень крутой контент, прям глаз радуется когда у тебя подписчики растут
спасибо. Как всегда по теме. Коротко и ясно.
Гений 👌🏻💪🏻 лучшие видео из всего ютуба
Cижу в 2023 и смотрю это видео, какой же у Тимура качественный контент)
Тимур,спасибо тебе,твои видео вдохновляют,весь ютуб перелазил и забыл что есть гений.
Для поддержки канала)) Давай серию уроков про jest, тестировать можно одно из тех приложений что ты делал в предыдущих видео. Думаю многим будет актуально.
Спасибо огромное!
Крутое и полезное видео! Спасибо!
Спасибо!
Спасибо!
Твои плейлисты очень полезны и скажу, что они очень хороши и максимально полезны для всех! Вопрос можно сделать полосу заполнения данных в конкретной созданной форме в React/
Большое спасибо!!!
Спасибо за годный контент. Стор пропагиНэйшн улыбнул)
отличное видео.Интересно было бы посмотреть про typescript. Именно показать его мощь(не только типизация пропсов).
Будут видосы про тайпскрипт!)
спасибо :)
афигенский контент!!!!!
Спасибо!)
Подскажите, как поступить со скроллбаром при overflow: hidden;
Thanks!
посмотрел, хорошее виде, для новичков самое то.
Ты прям решил все мои видео осилить, красавчик))
Тим, ну пишу из 21 го года, спасибо за видос, ты меня на мысль натолкнул, еще бы радиальное меню показал)))
Круто и полезно !
#react #burgermenu
Спасибо друг!)
Быстро чётко
Спасибо!)
FullName согласен!
Рили интересно
👏
еще интересная тема в тестировании BDD. Codecept + Puppeteer
Спасибо за интересный контент! Есть такой вопрос: тут на body не навешивался overflow: hidden для блокировки скролла страницы. Если всё-таки нужно будет заблокировать скролл при открытии меню, то как правильно обратиться к body в React? (вроде бы как в Реакте считается нехорошо обращаться к элементу через document.querySelector)
Просто обращаемся к боди, не нужен никакой querySelector
document.body.style.overflow = "hidden";
когда меню скрывается, возвращаем скролл:
document.body.style.overflow = "visible";
Спасибо за видео. Продолжение курса по nodejs и реакту будет? Закончить хочется
Продолжение будет 100%. Приложение до логического завершения мы доведем, на днях будет новый ролик)
так быстро что ппц...неугнаться....
top!
thx
очень полезное видео, у самого получалось не правильно как-то)
Спасибо за отзыв!
в ролике не корректно показали откуда взялись иконки. Подключили не тот CDN
Хорошо бы исходник . Если не жалко конечно.
Чувак ты спас мою карьеру))) я джун
Хеех) Успехов!
А как это заанимировать?
Все очень круто) но очень быстро как по мне )
Стараюсь не затягивать ролики, спасибо за отзыв!)
вы пишите код в visual studio code?
а можно где-то архив проекта найти, а то есть ошибка: 'active' is not defined и я не понимаю как ее исправить, хотелось бы на код взглянуть
К сожалению в данном уроке нет, не загрузил никуда исходный код. Проверьте переменную active, ее не видно
Ulbi, все чётенько, приятно слушать.
PS уже не раз замечаю что ты говоришь стоп пропаГИнэйшн, а не стоп пропагэйшн)) (я не со зла, просто прикольно)
ruclips.net/video/N0LWLkaJz1I/видео.html
Просто проф сдвиг из-за пагинации
0:24 "мы здесь не дизайном занимаемся" - можно смело переименовывать канал)))
Не могу никак понять как закрывается меню при нажатии на ссылку, stopPropagation должно ведь помешать закрыть меню при нажатии на все что внутри блока
У тебя другой url открывается, это основа роутинга, ты нажимаешь на ссылку - у тебя компоненты перерисовываются с новым url, поэтому и закрывается
Класс! Еще бы текст проекта куда-нибудь выложить или ссылку на ГитХаб приложить, если выложен. А то с экрана неудобно искать нужные фрагменты.
Есть вопрос, что если nav секция изначально без бургера, а при определённой ширине становится бургер. Как здесь подключать компонент?
В хедере, где будут лежать nav и adaptive nav сделать стейт, и записывать в него ширину при изменении размера экрана? И исходя из этого стейта уже вызывать компонент?
ппц насколько же Vue легче
Вью конечно полегче, но не сказать что прям сильно, дело привычки)
Мне реакт наоборот легче дался, меньше магии, понятнее как все работает...
+++
++))
а про key для map не слышали...
Дружище помоги пожалуйста, у меня ошибка и всё никак не могу понять в чем дело((( Отпиши пожалуйста,,,
Про адаптивность только последняя минута видео. Первые 12 минут зря смотрел. За это дизлайк.
Один вопрос? если ты знал всё до последней минуты, зачем ты сюда зашел? узнать про @media?
просто не понимаю зачем свой рот открывать. я бы понял если бы код не понравился или что-то подобное. или вообще ничего не работает.
начни свой Ютуб проект по верстве я с удовольствием посмотрю на правильные видео. А то может я тут зря на тебя наехал
А тебе надо было 50 минут адаптивности?)) Ну и кринж