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

Поделиться
HTML-код
  • Опубликовано: 28 ноя 2024

Комментарии • 81

  • @fullname9437
    @fullname9437 3 года назад +25

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

  • @Dan-t9c2x
    @Dan-t9c2x 3 года назад +8

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

    • @UlbiTV
      @UlbiTV  3 года назад +1

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

  • @SanchirEmgushov
    @SanchirEmgushov Год назад +2

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

  • @МаксимЖук-к9ж
    @МаксимЖук-к9ж 3 года назад +2

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

  • @aleksandriero1283
    @aleksandriero1283 2 года назад +1

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

  • @РоманБыков-э6м
    @РоманБыков-э6м 2 года назад +3

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

  • @Рита-к6у
    @Рита-к6у 17 дней назад

    Боже, ты просто лучший, повторила еще Context

  • @РусланМарков-ф3ш
    @РусланМарков-ф3ш 2 года назад +1

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

  • @Quentinrei
    @Quentinrei 2 года назад

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

  • @РустамАсланов-г7ю
    @РустамАсланов-г7ю 3 года назад +1

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

  • @barbatage5078
    @barbatage5078 4 года назад +8

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

    • @UlbiTV
      @UlbiTV  4 года назад +1

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

  • @posmotrel333
    @posmotrel333 6 месяцев назад

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

  • @yevgenilagno5219
    @yevgenilagno5219 Год назад

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

  • @alexalex-zh4ep
    @alexalex-zh4ep 2 года назад

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

  • @AlenaHrudavenka
    @AlenaHrudavenka 2 года назад +1

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

  • @vladyslavfx3892
    @vladyslavfx3892 3 года назад +4

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

  • @qwe-rty-
    @qwe-rty- 3 года назад +3

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

  • @aleksandr447
    @aleksandr447 3 года назад

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

  • @roxydevil1
    @roxydevil1 3 года назад +2

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

  • @makeoverweb2663
    @makeoverweb2663 3 года назад +3

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

    • @UlbiTV
      @UlbiTV  3 года назад +2

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

  • @АлександрЕрмолов-п2ь

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

  • @kirillshapovalov495
    @kirillshapovalov495 3 года назад +2

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

    • @UlbiTV
      @UlbiTV  3 года назад +1

      Спасибо!

  • @mszulya4100
    @mszulya4100 3 года назад +2

    Спасибо!

  • @xela_8746
    @xela_8746 3 года назад

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

  • @blgarOk
    @blgarOk 3 года назад +1

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

  • @ВладимирЛитовченко-ш3н

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

  • @user-bo7mb9cf4d
    @user-bo7mb9cf4d 3 года назад +2

    Быстро чётко

    • @UlbiTV
      @UlbiTV  3 года назад +1

      Спасибо!)

  • @Max-kr4ie
    @Max-kr4ie 3 года назад +2

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

    • @UlbiTV
      @UlbiTV  3 года назад +2

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

  • @skily4866
    @skily4866 3 года назад +1

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

  • @Ramosok
    @Ramosok 2 года назад

    FullName согласен!

  • @СергейФомин-ъ5ж
    @СергейФомин-ъ5ж 3 года назад +1

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

  • @makeoverweb2663
    @makeoverweb2663 3 года назад +1

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

  • @АрманФазыл
    @АрманФазыл 3 года назад +2

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

    • @UlbiTV
      @UlbiTV  3 года назад

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

  • @artempavlenko5147
    @artempavlenko5147 3 года назад +2

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

    • @UlbiTV
      @UlbiTV  3 года назад

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

  • @ВячеславШевчук-х9д
    @ВячеславШевчук-х9д 3 года назад +2

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

    • @anazkomult
      @anazkomult 3 года назад +2

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

  • @No-kq9rq
    @No-kq9rq 3 года назад +2

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

    • @UlbiTV
      @UlbiTV  3 года назад +2

      Спасибо!)

  • @MrVertu01
    @MrVertu01 3 года назад +1

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

  • @МаксимСушко-л7о
    @МаксимСушко-л7о Год назад

    спасибо :)

  • @miangel0
    @miangel0 4 года назад +1

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

    • @UlbiTV
      @UlbiTV  4 года назад

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

  • @kirillov2school
    @kirillov2school 3 года назад

    Thanks!

  • @agsmith899
    @agsmith899 Год назад +1

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

  • @ЕвгенийВоронков-ч2э

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

    • @UlbiTV
      @UlbiTV  3 года назад

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

  • @Iamthelola
    @Iamthelola 7 месяцев назад

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

  • @gulik5048
    @gulik5048 3 года назад +1

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

  • @Djuslun
    @Djuslun Год назад

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

    • @libertariancom
      @libertariancom Год назад

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

  • @antonkudrin7060
    @antonkudrin7060 3 года назад +2

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

    • @UlbiTV
      @UlbiTV  3 года назад +1

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

  • @itpro952
    @itpro952 4 года назад

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

    • @UlbiTV
      @UlbiTV  4 года назад

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

  • @Vlad-us9xt
    @Vlad-us9xt 3 года назад +1

    top!

  • @jamjam3337
    @jamjam3337 Год назад

    👏

  • @Михаил-ц1ь1у
    @Михаил-ц1ь1у 2 года назад

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

  • @vagoalex13
    @vagoalex13 2 года назад

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

  • @mikhail_shokun
    @mikhail_shokun 2 года назад

    Ulbi, все чётенько, приятно слушать.
    PS уже не раз замечаю что ты говоришь стоп пропаГИнэйшн, а не стоп пропагэйшн)) (я не со зла, просто прикольно)
    ruclips.net/video/N0LWLkaJz1I/видео.html

    • @libertariancom
      @libertariancom Год назад

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

  • @ВладиславДульцев-и3в

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

  • @yankov2206
    @yankov2206 Год назад +1

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

  • @ea5970
    @ea5970 4 года назад +1

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

    • @UlbiTV
      @UlbiTV  4 года назад

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

    • @anazkomult
      @anazkomult 3 года назад

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

  • @zloy_ax8496
    @zloy_ax8496 3 года назад +1

    +++

  • @tutor2024
    @tutor2024 2 года назад

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

    • @schroedingerscat6810
      @schroedingerscat6810 2 года назад +1

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

    • @schroedingerscat6810
      @schroedingerscat6810 2 года назад +1

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

    • @libertariancom
      @libertariancom Год назад

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

  • @user-qm6pu1bl9n
    @user-qm6pu1bl9n Год назад

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