19. Уроки React JS (route, browser-router, маршрутизация) - react курсы бесплатно

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

Комментарии • 1,8 тыс.

  • @pvm1221
    @pvm1221 3 года назад +547

    Спасибо за уроки !
    Синтаксис в ролике работает для версии react-router-dom

    • @moec6522
      @moec6522 3 года назад +13

      Спасибо большое, дружище, выручил)

    • @galinagumenyuk3923
      @galinagumenyuk3923 3 года назад +9

      Спасибо!!!! я сижу и думаю,то ли лыжи не едут, то ли я.... все отрисовалось с новым синтаксисом)

    • @АлексейЧудновец-е9з
      @АлексейЧудновец-е9з 3 года назад +4

      Спасибо огромное, очень помог твой комментарий :)

    • @natashabatasha897
      @natashabatasha897 3 года назад +8

      Спасибо тебе, Павел!!!
      Поправочка. Если до этого в Navbar писали /dialogs, то не забудьте path так и прописать

    • @אסתרבובר
      @אסתרבובר 3 года назад +4

      огромное спасибо за этот код!!! он мне очень помог.

  • @igorekupaev1134
    @igorekupaev1134 3 года назад +635

    В новой версии выдает ошибку, правильно теперь вот так:



    Не благодарите:)
    // Кстати я устроился на работу, уже прошло 5 рабочих дней. Так что все реально, главное не опускать руки и будет все хорошо:)

  • @АннаХодырева-о7б
    @АннаХодырева-о7б 3 года назад +159

    Ребят, кто в 2021 смотрит, у кого ошибка с route. Он сейчас по-другому работает. Нужно сделать так:

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

      листала комменты специально ради этого, спасибо!!!

    • @дадая-в1о
      @дадая-в1о 2 года назад

      Спасибо большое, очень помогли)

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

      13.05.22 ничего не работает

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

      Спасибо

    • @Sebastianty-w5k
      @Sebastianty-w5k 2 года назад

      @@FlyDem где сейчас можно найти инфу?

  • @vadimkovtunenko1067
    @vadimkovtunenko1067 Год назад +15

    Спасибо большое Дмитрий 👏👍
    Для 6 версии синтаксис такой
    import {BrowserRouter, Routes, Route} from "react-router-dom";

  • @АндрейПахомов-м7ъ
    @АндрейПахомов-м7ъ 4 года назад +238

    У твоих уроков эффект сериалов. В конце интересно начать новую серию. Спасибо!

  • @romankopylchak4128
    @romankopylchak4128 2 года назад +2

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

  • @brainboom5509
    @brainboom5509 5 лет назад +130

    Блин, меня действительно подкупает такая искренность и отдача. Ставлю перед собой цель -- комментировать и лайкать каждое твое видео, Спасибо еще раз))

  • @toptorba3897
    @toptorba3897 3 года назад +5

    Щире дякую Дімич -- дуже круто!!!)
    Маленький UPDATE:
    import { Route, Routes, BrowserRouter } from "react-router-dom";
    ...

  • @Евгений-ж1ы1ф
    @Евгений-ж1ы1ф 5 лет назад +518

    Не забывай говорить вших вших вших (как самурайским мечем!) 😀 🐼

    • @shepotpatriot
      @shepotpatriot 4 года назад +28

      Это, кстати, очень важно!

    • @0palev
      @0palev 4 года назад +5

      да мечи очень важны!)

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

      Тебе плохо?

    • @annakarelina6841
      @annakarelina6841 3 года назад +7

      Меня это так бесило вначале, а сейчас без "вших-вших" уже грустно(( Смотрю залпом по несколько уроков, канал как родной стал

  • @IAMSHEVCHUK
    @IAMSHEVCHUK 2 года назад +44

    Для меня сработал следующий вариант:
    import {BrowserRouter, Route, Routes} from "react-router-dom";
    const App = () => {
    return(












    );
    }

    • @PadreZadrot
      @PadreZadrot 2 года назад +2

      Ты единственный кто выручил, спасибо огромное)
      ругается если не обернуть все в возможно из-за дополнительных тегов.
      const App = () => {
      return (
















      );
      }

    • @smakdigital
      @smakdigital 2 года назад +2

      Спасибо огромное, все способы перепробовал, твой коммент очень помог!!)

    • @AlexM-uz1hg
      @AlexM-uz1hg 2 года назад

      Спасибо, человече ;)

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

      огромное спасибо ты лучший

    • @ИванКрутов-о4з
      @ИванКрутов-о4з 2 года назад

      @@smakdigital как мама поживает?????

  • @deepindub
    @deepindub 5 лет назад +164

    11:47 "...что эта запись даст?"-послышалось совсем другое ахахах

    • @ITKAMASUTRA
      @ITKAMASUTRA  5 лет назад +9

      Бывает))

    • @КимКузин-й9ж
      @КимКузин-й9ж 5 лет назад +17

      @@ITKAMASUTRA звучит как новая песня Эдуарда Сурового

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

      @@КимКузин-й9ж а мы сидим. Без Дим..

    • @evgeniyprowork
      @evgeniyprowork 4 года назад +6

      слушаю на скорости 1.25, раза 3 прослушал, только потом осознал что имеется ввиду )

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

      хахах

  • @dlucky13
    @dlucky13 4 года назад +34

    Дима блин. Я просто фанат твоей манеры изложения материала. До этого читая книги по программированию я засыпал практически над ними иногда. А тут все интересно и весело. Если бы мне так в школе на информатике преподавали бы, я уже точно после школы стал бы программистом. Некоторые твои уроки можно на цитаты прям разбирать. Я не знаю где у тебя шило, но твой задор и твоя манера изложения это нечто. Обнял)

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

      Угу, как будто гопник с семками, выучивший слово инкапсуляция

  • @sldstrst2022
    @sldstrst2022 4 года назад +139

    ну что, впервые на youtube появился человек, которому ставишь сначала лайк, а потом смотришь, а не наоборот

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

      Еще Евгений Таранов и Ярослав Брин

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

      Подтверждаю

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

      Я бы ставил и До и После))

  • @gameroom6690
    @gameroom6690 4 года назад +31

    Для тех кто смотрит в 2к20 с роутами небольшие изменения:
    1) import {BrowserRouter as Router, Route} from 'react-router-dom';
    2) всё заключаем в тег Router
    3) отдельные пути через Route

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

      Смотрю в 2к22, не хочет работать так

    • @NickiSchultz_
      @NickiSchultz_ 2 года назад +5

      Дополняю частью рабочего кода, версия 6.3.0
      Return(
      )

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

      @@NickiSchultz_ Почему-то Routes is not defined

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

      @@alexqwerty3673 а import {BrowserRouter, Route, Routes} from 'react-router-dom' добавлен?
      Как самурай сказал, за импорт элементов не забывать)

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

      @@NickiSchultz_ да, все добавлено, только Routes подчеркивается волнистой линией, как я понимаю он не находит его в react-router-dom

  • @firepixel9701
    @firepixel9701 5 лет назад +30

    Лайк, подписка и что там еще можно. Где ж ты раньше был со своими уроками. Я наконец то начал понимать реакт!!!

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

    За 20 минут сделала кликабельными Music, News, Settings
    Все получилось с первого раза. Только ссылки забыла в какой папке лежат, но потом нашла в Навбаре. Все отлично спасибо за знания!

  • @mikhailivlev
    @mikhailivlev 5 лет назад +33

    я сам понял что смотрю уроки без подписки где то на 12-14 уроке)) канешн подписался) и перед просмотром лайк)
    хоть как то помогу)

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

    mersi cavt tanem, mernem janit aziz, qo shnoriv jamanaks karchacreci

  • @rmnkot
    @rmnkot 6 лет назад +54

    в vs code ctrl+p - поиск файла, ctrl+tab - навигация по открытым файлам

    • @ITKAMASUTRA
      @ITKAMASUTRA  6 лет назад +3

      спасибо, попробуем!!!!

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

      Можно колесом мыши сверху прокручивать заголовки открытых файлов -тоже нормальная каруселька получается)

  • @ЕвгенийЧелноков-т1ш
    @ЕвгенийЧелноков-т1ш 2 месяца назад

    Продолжаю смотреть в 2024 г. Всё супер, ты лучший.

  • @MrMomomoy
    @MrMomomoy 3 года назад +16

    Привет всем из 2021. Сейчас уже вышел 6й реакт роутер дом. Там ряд нововведений. Вместо components надо писать element. Пример . было , стало - . Я блин полтора часа времени убил чтобы понять почему оно не работает. Так же теперь вместо Switch используется Routes

    • @АннаЧикалова-о9я
      @АннаЧикалова-о9я 3 года назад

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

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

      Спасибо :)

    • @iMan-ql4gx
      @iMan-ql4gx 3 года назад

      Спасибо. Респект ))

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

      Ты потратил время не впустую самурай, ты спас много времени остальных! Спасибо=))

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

      Привет, у меня не получается, не могу сдвинуться с места, мог бы помочь?

  • @ИгорьАлександрович-к5в

    2021 г. май - все получается. Другие три страницы (ссылки) создать получилось. Спасибо Димыч!!!

  • @scertyy
    @scertyy 4 года назад +6

    Блин, я как зависимый - "Еще одну и ТОЧНО спать" и так до утра) Спасибо тебе за твой труд!)

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

      Ложись в 11 вечера, и будешь учиться в 3 раза быстрее!

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

      @@kioko1007 золотые слова. А еще пик мозговой активности с раннего утра и до 12 примерно

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

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

  • @viktorlysenko89
    @viktorlysenko89 4 года назад +6

    Бомбим дальше!)
    Всем привет с Винницы!

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

    Когда-то слышала утверждение, что чем лучше человек знает материал, тем проще может объяснить даже самые сложные моменты. Это про тебя! Точно-точно))

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

    Все интересней и интересней с каждым уроком становится, летим дальше, домашку сделал вшух вшух

  • @codegorian6057
    @codegorian6057 4 года назад +13

    спосибо Димыч джан, весь курс прошел, всё было ооооооооооочень круто, сматри 2 раз чтобы укрепить знания

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

      И как дела у тебя братец? Устроился на работу?

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

      @@andreiBylkin да брат, уже 6 месяца как устроился, сначала было очень тяжело, провалил около 10 собеседование, но не стаял на месте учил дальше, все будет хорошо, не сдавайся ;)

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

      @@codegorian6057 долго устраивался, если не секрет?:)

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

      @@andreiBylkin полтора года

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

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

  • @СергейЗуев-л2ш
    @СергейЗуев-л2ш 5 лет назад +9

    Все получилось, ух react завлекает с каждым видео,Крутяк Димыч Спасибо

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

    Подписан с 19 года, колокольчик при мне, лайки завожу, комменты - сори что начал "спасибо" дублировать, спустя 18 уроков, уже фантазия иссякает😅🚀

  • @happyrichboy7
    @happyrichboy7 4 года назад +4

    Первый видеокурс за который хочется заплатить! 👍👍👍

  • @ИльяИваник-ф8ф
    @ИльяИваник-ф8ф 4 года назад

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

  • @АлександрЕрмолов-п2ь
    @АлександрЕрмолов-п2ь 3 года назад +10

    12.11.2021!
    Синтаксис изменился.
    Теперь пишется так:

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

      в топ!!!! очень помог!!!

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

      спасибо, добрый человек

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

      Привет, у меня не получается, не могу сдвинуться с места, мог бы помочь?

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

      @@theway_up что конкретно ?

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

    Благодаря Вашим объяснениям и комментаторам смогла настроить маршрутизацию) Всё получилось, теперь берусь за конспект !

  • @in_the_fox_fur
    @in_the_fox_fur 3 года назад +6

    --2021--

    **

    **

    Теперь тег оборачивается в тег , а component={Profile} меняем на element={}(в элемент тоже прописываем тег).

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

      Может быть Вы знаете, почуму IDE(WS) подчёркивает Routes, в импорте?? И как это исправить?

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

      @@theWorldIsMultivariate , я работаю через Visual, такого у себя не замечала, прописывала вот так import { Route, Routes } from "react-router-dom";

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

      @@in_the_fox_fur понятно, спасибо.

  • @harmony-ai-world
    @harmony-ai-world 2 года назад

    Спасибо за полезный курс, такая плавная подача материала ставит все точки над И во время обучения и не оставляет вопросов. Приятно, что в комментариях тоже люди активно помогают, когда синтаксис React изменился.

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

    Спасибо за курс. Отличный материал даже в 2022 году. Сначала напрягало, что ты излишне разжёвываешь инфу, однако заметил, что какие-то невероятно базовые вещи не осознавал до твоего курса

  • @ascar66
    @ascar66 2 года назад +8

    Все получилось. Теперь App.js выглядит так
    const App = () => {
    return (















    );
    }

  • @Дмитрий-щ3щ4щ
    @Дмитрий-щ3щ4щ 4 года назад

    Дима - космос, все по делу, а главное все работает, показываешь, рассказываешь - как все по документации первоисточника (это редкость сейчас)

  • @Василий-з9к7р
    @Василий-з9к7р 2 года назад +24

    2022
    Много кто уже писал о особенностях 6 версии.
    Меня не устраивало, что Profile не загружался по умолчанию
    Ниже пример как это поравить
    const App = () => {
    return (












    )
    };
    так же в компонентах можно поменять на
    Profile

    Позволяет не перезагружать страницу при переходе по ссылкам

    • @КсенияМатвеева-ь7о
      @КсенияМатвеева-ь7о 2 года назад

      Спасибо тебе!!!!Прям большое большое!!!))))))

    • @СашаКаплюхин
      @СашаКаплюхин Год назад

      Спасибо большое за ответ!

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

      * - его используют когда указан неправильный путь. Тогда получается что при каждом неправильном пути, будет отображаться Profile. А если ты хочешь чтобы при неправильном пути грузилась твоя кастомная страница 404?

  • @СергейПолукаров-з6г
    @СергейПолукаров-з6г 4 года назад +2

    Прем вперед!!! Димыч Красавчик!!!

  • @ДенисКораблёв-г1т
    @ДенисКораблёв-г1т 5 лет назад +4

    Все супер, все становится на свои места, очень доходчиво, смотрю дальше

  • @ВладиславИщенко-э9щ

    начинал зимой учить, но не было времени изза работы и остановился на 33 уроке . сейчас заново за день взахлеб уже на 19. Все понятно и интересно .Спасибо !

  • @Ervin_Konig
    @Ervin_Konig 3 года назад +6

    актуальные правки на конец 21-го года:
    import {BrowserRouter, Routes, Route} from "react-router-dom";
    а сами роуты должны быть прописано вот так:

    • @ЕкатеринаПонкратова-у9о
      @ЕкатеринаПонкратова-у9о 3 года назад

      спасибо, долго парилась, ты очень помог! успехов

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

      Может быть Вы знаете, почуму IDE(WS) подчёркивает Routes, в импорте?? И как это исправить?

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

      Спасибо а то уже не знал что делать

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

      Привет, у меня не получается, не могу сдвинуться с места, мог бы помочь?

  • @МиколаКуціль-ж5ы
    @МиколаКуціль-ж5ы 4 года назад

    Круто!
    Завдання виконав, йдемо далі!
    Дякую за курс)

  • @ВанькаЕремченко
    @ВанькаЕремченко 6 лет назад +5

    Круто, сейчас уже стало интереснее, начинаю писать код) Спасибо

    • @ITKAMASUTRA
      @ITKAMASUTRA  6 лет назад +1

      ага, оно как расскачка идёт - всегда интереснее! ну и темы сейчас будут поживее и поинтереснее))

    • @Insert-any-prefix-
      @Insert-any-prefix- 4 года назад

      Ну что там, нормально раскачался?

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

    Спасибо огромнейшее!!! (и ребятам - за измененный синтаксис для react-router-dom версии 6)

  • @nehilspirit435
    @nehilspirit435 5 лет назад +4

    Спасибо за урок) Все получилось) Домашнее задание готово) Летим дальше!

  • @КристинаДесятнюк-х3ш

    Супер. Все важные темы просматриваю в среднем по 3 раза. В коде никаких нон-стопов нет. Невозможно не понять. Спасибо большое.

    • @КристинаДесятнюк-х3ш
      @КристинаДесятнюк-х3ш 3 года назад

      В написании сайтов я совсем новичок. Первая библиотека которую глобально изучаю это реакт.Подскажите пожалуйста laravel и react это разные библиотеки или как? И можно ли на чистом реакте без добавления других библиотек написать авторизацию, регистрацию?Сразы скажу еще курс не прошла. Пока только нам 23 уроке

  • @ihorshylov8362
    @ihorshylov8362 5 лет назад +5

    Круто, спасибо большое!
    Получается все, делаю сам, оно как-то работает но в голове еще куча вопросов)
    Надеюсь к концу проекта вопросов будет намного меньше)

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

    никогда еще образование не было таким приятным! Респект!

  • @kristinanarejko5024
    @kristinanarejko5024 2 года назад +6

    в app.js
    добавляем такой импорт: import {BrowserRouter, Routes, Route} from "react-router-dom";
    весь код после return оборачиваем в
    далее добавляем


    чтоб посмотреть работает ли в браузере в пути в конце после слэша пишем то что написано в path тоесть /profile либо /dialogs.

    • @ВераАлександрова-ъ8и
      @ВераАлександрова-ъ8и 2 года назад +1

      Золотой ты человек! Что сейчас код надо другой прописывать - многие отписались, а вот как проверить, что работает - искала полчаса))))

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

      Спасибо тебе большое, ты супер! Очень помог твой комментарий!

  • @musicfortheears6471
    @musicfortheears6471 Год назад +10

    Ребят, кто смотрит в 2023, и у кого ошибки с роутингом. В последней версии реакт-роутер-дом изменился синтаксис. Вот рабочий код:
    import { BrowserRouter, Routes, Route } from "react-router-dom";
    const App = () => {
    return (












    );
    };

  • @ОлегСелин-ш9ы
    @ОлегСелин-ш9ы 4 года назад +1

    Отличный экспресс курс на данный момент) смотрю пяток видео, затем пишу код)

  • @nancyrainbow_cut
    @nancyrainbow_cut 5 лет назад +84

    Вдруг кто-то делает наперёд как я. После кода на 16:11 выходит какая-то ошибка с Routa'ми. Не гуглите, дальше всё объясняется))

    • @vladim1
      @vladim1 5 лет назад

      я тоже топтался на этой ошибке, пока все не досмотрел )

    • @Brinzovik
      @Brinzovik 4 года назад +2

      такие комментарии должны быть вверху!!

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

      Ааа)) спасибо, час уже гуглю)

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

      Дякую, ти зекономив мені час)

  • @МихаилСабуров-ы1в

    Очень грамотно, что сначала проходим роуты а потом уже будут мэпы и прочее. Так материал воспринимается лучше намного

  • @konstantinkuksov914
    @konstantinkuksov914 4 года назад +9

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

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

    Красавчик ,ставлю лайки - коменты . Как всё досмотрю ,с меня донат .Потом , когда устроюсь +солидный донат. И с первой зарплаты донат. Это точно . Ты красава,Димыч .

  • @MDFireX5
    @MDFireX5 5 лет назад +29

    Бля, давно у меня такого не было, такое чувство, что я в 2006 и смотрю сериал Солдаты, не надоедает и очень интересное, очень давно не ощущал такую заинтересованность ! Димыч THANK YOU !

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

    Роутинг залетел!! в React все продумано!!Огонь!

  • @EugeneMilto
    @EugeneMilto 6 лет назад +7

    Круто. Заходит как любимый сериал 😁

    • @ITKAMASUTRA
      @ITKAMASUTRA  6 лет назад +7

      санта-барбара (старпёры поймут) отдыхает) Димыч планирует снять серий 150)))

    • @torex1123
      @torex1123 6 лет назад

      @@ITKAMASUTRA Проблема любимых сериалов в том, что ты не хочешь чтобы они заканчивались..(

    • @nehilspirit435
      @nehilspirit435 5 лет назад +1

      @@ITKAMASUTRA Хоспади) С ужасом поняла, что помню даже имена персонажей Санта_Барбары))
      Но Евгений прав) Я тож как увлекательный сериал смотрю) Основы знаю, но видео не проматываю и не пропускаю) Столько мелочей Дмитрий рассказывает, боюсь пропустить что то))

  • @lerne-du
    @lerne-du 4 года назад +2

    Еще раз ОГРОМНОЕ тебе душевное спасибо за то, что все так подробно разжевываешь. Я буквально вчера была на онлайн тренинге по react и слушала о компонентах. Рука-лицо... даже стыдно за тренера стало после того, как видела уже твои пояснения. Я не просто пишу, я ПОНИМАЮ, что я пишу и как оно примерно будет работать. Спасибо! 💕

  • @dzhekson2293
    @dzhekson2293 2 года назад +16

    Внимание всем кто смотрит в МАЕ 2022, react-router-dom - с появлением 6 -ой версии изменился синтаксис: 1. Импорт - import {BrowserRouter, Route, Routes} from 'react-router-dom';
    2. В App.js нужно писать только так или работать не будет -
    function App() {
    return (












    );
    }
    ДО сих пор АКТУАЛЬНО

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

      Я без function написал и работает

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

      От души! Выручил)

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

      Братан, не работает можешь помочь, через соц сеть как то

  • @MaksymTkachuk-k8j
    @MaksymTkachuk-k8j 4 года назад

    Капец, это очень круто, я такую же штуку делал в js,а тут две компоненты и ты Бог)

  • @andreygladilin5324
    @andreygladilin5324 2 года назад +4

    и
    import { BrowserRouter, Routes, Route } from 'react-router-dom';
    в противном случае белый экран(((
    Автору спасибо за изложение материала. Ну поменялся синтаксис -- не беда)

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

    сначала посмотрел просто так, понял всё, пересмотрел и записал в тетрадь всё село в голове. Спасибо Димыч)

  • @mikhailsvetkin735
    @mikhailsvetkin735 2 года назад +4

    Спасибо за отличное видео. Но для тех кто смотрит это видео в 2022 году с версией 6 react-route-dom, то нужно написать вот так
    import {BrowserRouter, Routes, Route} from 'react-router-dom';
    const App = () => {
    return (







    Главное не забыть добавить BrowserRouter, Routes, Route в import.

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

      Спасибо )👍

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

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

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

      Привет, у меня не получается, не могу сдвинуться с места, мог бы помочь?

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

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

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

      @@theway_up Там всё намного проще чем кажется. Смотри, для начала, в файле App.js сделай правильный импорт, он будет отличаться чем в видео, так как вышли новые версии данной библиотеки. Правильный импорт будет примерно таким: import {BrowserRouter, Routes, Route} from "react-router-dom";
      Далее, в этом же файле, после скобки слова return пропиши тег и закрой его перед последней скобкой с точкой и запятой.
      Третий этап: все теги что у тебя есть в данном файле, оберни их в тег , и не забудь его закрыть после последнего .
      Вроде это всё, что тебе нужно сделать

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

    Димыч, ты первый человек и твой канал - мой первый контент на пути к фронтенду, в принципе я из-за твоего канала и начал заниматься JS разработкой, так как именно на него наткнулся, когда загуглил: "С чего начать путь программиста" )))

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

    Благодаря коментариям можно очень ускорить процесс своего обучения

  • @AndreiS-cu2wb
    @AndreiS-cu2wb 5 лет назад +4

    Ты крутой, продолжай в том же духе!!!)

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

    Кууулл Продовжуєм і знов Дякуємо)) Ти кращий!

  • @lvasmart3516
    @lvasmart3516 4 года назад +36

    У кого после 17-49 вылезет такая ошибка :
    Attempted import error: 'react-router-dom' does not contain a default export (imported as 'Route').
    Исправляется тем, что импорт в App.js нужно прописать ВРУЧНУЮ
    import {BrowserRouter, Route} from "react-router-dom";
    - именно такой, как на видео,
    а не тот, что прописывает WebStorm !

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

      спасибо , я уже думал не найду ошибку !!!!

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

      Я теж так робив

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

      Благодарен даже в 2021году

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

      У меня требует Routes вместо Route. А потом не видит ни Dialogs, ни Profile.

    • @АнтонЧислов-я7л
      @АнтонЧислов-я7л 3 года назад

      @@denyskosyriev2256 такая же фигня

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

    Просто спасибо за курс и за то, что запустил цепочку позитива и взаимовыручки!
    В комментах такие классные советы.
    Спасибо каждому, кто не поленился отписаться после удачного решения

  • @Павел-ю6у3б
    @Павел-ю6у3б Год назад +4

    Всем привет из 2024.
    Сейчас рабочий вариант такой:
    import { Routes, Route, BrowserRouter } from 'react-router-dom';

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

      Спасиб кста комент написан 5 месяцев назад как там прошел путь самурая офер получил ??

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

    19 уроков прошли как песня! Погнал выполнять маленькую простую домашку) Спасибо, всё круто.

  • @СэмФишер-х4д
    @СэмФишер-х4д 2 года назад +1

    спасибо за видос! к уроку добавлю - посмотрите как работать с зависимостями с помощью npm. на том же ютубе есть коротенькие видосы, которые объясняют структуру package.json и как устанавливать зависимости(флаги -save --dev). времени потратите немного, но это будет крайне полезно.
    что касается рутера, то на момент выхода видео такой вариант написания устарел,в комментариях дают актуальный вариант(и скорее всего если поменяется допишут), но я бы порекомендовал тем у кого не работает погугглить самим как исправить код урока(а не копипастить),чтобы он работал, это будет хорошая практика на понимание реакта, заодно докуху по рутеру изучите. также стоит начать использовать консоль F12 - таб console. там вы сможете увидеть ошибки

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

    Окрема подяка коментуючим, ви найкращі! Значно пришвидшуєте пошук інфи) Летимо далі🏃🏃🏃

  • @sharomet
    @sharomet 5 лет назад +17

    Сейчас вроде --save писать не надо, npm автоматически добавляет в package файл

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

    Все гуд бегу далее)) А тема с картой проекта реально все упрощает!

  • @Milku_kit
    @Milku_kit Год назад +3

    В общем, ребят. По состоянию на 2023:
    1) npm uninstall react-router-dom
    2) npm i react-router-dom@5 -save
    const App = () => {
    return (












    );
    }

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

    Очень информативный урок! Дотошно как для детей, как и всегда, за это спасибо. Так же как и у других, возникла проблема в синтаксе, но все решилось. Дз выполнил, проблем не возникло.

  • @YagorTruhan
    @YagorTruhan 4 года назад +19

    ЭТОТ комментарий для тех, у кого не работает программа из-за ошибки 'Route' is not defined. Я долго думал и нашёл в чём проблема. Просто вы плохо установили react-router-dom на этом моменте 12:50. Посмотрите в какую папку вы устанавливаете этот модуль. Вся моя проблема была в том, что я устанавливал этот модуль не в ту папку и я просто перешёл на уровень выше в файловой системе и всё успешно установилось, а после и заработало. Короче может я и плохо или не правильно объяснил, может для когото эта ошибка звучит глупо, но я просто хочу помочь такому же человеку, как и я. Это один из выходов в этой проблеме, который помог мне, вам он может и не помочь.

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

      проще говоря, положите в папку своего проекта, у меня это папка my-app

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

    Просто волшебные объяснения! Безумно нравится ваш курс, всё понятно. *Мотивирует!*

  • @maxim.saharov
    @maxim.saharov 2 года назад +4

    полный рабочий код файла App.js на 13.03.2022:
    import React from 'react';
    import './App.css';
    import Header from './components/Header/Header';
    import Navbar from './components/Navbar/Navbar';
    import Profile from './components/Profile/Profile';
    import Dialogs from './components/Dialogs/Dialogs';
    import {BrowserRouter, Routes, Route} from 'react-router-dom';
    const App = () => {
    return (











    );
    }
    export default App;

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

    благодарю всех, кто подсказа изменения в синтаксисе, спасибо) И Димыч спасибо тоже за ролик

  • @3PuY
    @3PuY 6 лет назад +12

    Все легко и все понятно !) Спасибо !)

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

    Огромнейшее спасибо за курс!! Ты помогаешь реализовать мою цель, быть разработчиком!!

  • @soltanbkz
    @soltanbkz Год назад +4

    кто смотрит в 2023 route чуточку поменялся:
    import { BrowserRouter as Main, Route, Routes } from 'react-router-dom'
    const App = () => {
    return (












    );
    }

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

      Белый экран, видно только хидер и навбар без бэграунда

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

    Отлично! Спасибо тем, кто в комментариях дописывает обновления, иначе я бы застряла точноо)))

  • @kriptonVIP
    @kriptonVIP 4 года назад +2

    Дмитрий всё очень понятно и доходчиво благодарю!

  • @snoopquits-friend
    @snoopquits-friend 4 года назад +3

    то чувство, когда реакт на ts сейчас легче идёт, чем когда-то js

  • @ЕвгенийМакарук-ж8в
    @ЕвгенийМакарук-ж8в 3 года назад

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

  • @АнатолийЧерепанов-п5о

    обратите внимание на синтаксис, долго мучался и искал ответы.

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

      Спасибо

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

      Привет, у меня не получается, не могу сдвинуться с места, мог бы помочь?

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

    Ты так поясняешь, что я даже не знаю как можно не понять)) спасибо! Погнали дальше

  • @lennyskywalker7799
    @lennyskywalker7799 3 года назад +8

    Решила тоже приносить чуток пользы. Если будут появляться какие-то новые хоткеи в WS, буду в качестве комментария их писать под видео) Вдруг кому-то еще пригодятся :)
    Из тех, что записала на данный момент:
    Правый Ctrl + Shift + . - закомментировать;
    Alt + F12 - открыть терминал;
    Shift + F6 - переименовать файл;
    Alt + Enter - контекстное меню;
    Ctrl + Alt +L - форматировать код;
    Ctrl + Shift + N - поиск файлов;
    Ctrl + D - дублировать строку.

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

    Дмитрий, все получилось, три элемента для роутера настроены. спасибо, еду дальше!

  • @ЯрославНаконечний-е9у

    працює цей код, робив 18.04.23
    import {BrowserRouter, Route, Routes} from "react-router-dom";
    const App = () => {
    return (













    );
    }

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

    Разобрался! причем одну часть видео смотрел в один день и досмотрел вторую часть видео на след день, досмотрел до задания, и не работало переключение на News...блин, часа-пол понадобилось что б додуматься залезть проверить, а что мы делали с ссылками в НавБаре! зато на всю жизни запомнил
    круть, смотрю дальше-практикую, январь 2021!

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

    2021 году версия: "react-router-dom": "6.0.1",
    import { BrowserRouter, Routes, Route } from "react-router-dom"; вместо Switch импортируем Routes