Параметры в ссылках в React Router 6

Поділитися
Вставка
  • Опубліковано 7 січ 2025

КОМЕНТАРІ • 115

  • @Ivanesenses
    @Ivanesenses 3 роки тому +63

    Один из самых толковых каналов, объясняющих что-то про реакт на русском! Определенно продолжай.

    • @ДанилДмитриев-я5м
      @ДанилДмитриев-я5м Рік тому

      как успехи

    • @Ivanesenses
      @Ivanesenses Рік тому +1

      @@ДанилДмитриев-я5м устроился на позицию джуна в прошлом июне, в этом январе прошел интервью на мид-левел, поэтому успехи хорошие!

    • @ДанилДмитриев-я5м
      @ДанилДмитриев-я5м Рік тому

      @@Ivanesenses круто! мои поздравления

  • @es7729
    @es7729 2 роки тому +7

    На такие видео прям хочется остановить видео, поставить лайк и вернуться к просмотру.
    Большое спасибо, Михаил! Все очень понятно и доступно!

  • @ТатьянаРусак-ш5ю
    @ТатьянаРусак-ш5ю 2 роки тому +11

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

  • @andrewsam224
    @andrewsam224 Рік тому +3

    Миша!!! Спасибо тебе огромное!!! Дай бог тебе здоровья!! Ты меня прям спас!!! Застрял ни как не мог разобраться, после просмотра всё стало понятно. Аж прослезился, когда дошло. Благодарю!!!

  • @vladick4272
    @vladick4272 3 роки тому +12

    Очень вовремя ! Спасибо! Сейчас изучаю эту версию, а в документации 'черт ногу сломит', а здесь все понятно и лаконично! Однозначно лайк! Буду поддерживать ваш канал!

    • @aleksprimetv
      @aleksprimetv 3 роки тому

      все там нормально в документации с v4 сразу на v6 переводил.

    • @vladick4272
      @vladick4272 3 роки тому

      @@aleksprimetv congratulations 🎉🍾🎈

  • @nevrox6197
    @nevrox6197 Рік тому

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

  • @Moishe_Rubinstein
    @Moishe_Rubinstein 2 роки тому +4

    А автор, то хорош! Спасибо!
    Просмотрами обделен канал.
    Сильно лучше чем какие то Минины.

  • @three-zeros
    @three-zeros 2 роки тому +2

    Ваш канал - легенда русского программирования на Ютубе. Очень классные видео!

  • @RonaMelone
    @RonaMelone 3 роки тому +11

    Спасибо! Очень полезный и познавательный ролик! Намного доступнее для понимания, чем в документации ^^

  • @antonchudinov2057
    @antonchudinov2057 Рік тому +2

    Михаил, спасибо за ваш труд! Очень доступно объясняете материал!

  • @The14Some1
    @The14Some1 2 роки тому +1

    10:36 На этот случай можно добавить ещё один роут с редиректом на new, потому что new/edit скорее всего означает, что пользователь хотел именно туда:

  • @flavkaa2017
    @flavkaa2017 2 роки тому +1

    Как же просто и круто объяснено, благодарю

  • @ДмитрийМельников-ъ3в

    Ура! очень ждал =)) Спасибо!

  • @АнатолийГорбов-о1ь

    Михаил спасибо за такие подробные разборы!

  • @Sergey_Klimov
    @Sergey_Klimov 2 роки тому

    Как то на одном дыхании смотрится все. Лайк

  • @alsusayfulina1865
    @alsusayfulina1865 Рік тому

    Очень понравился урок, хорошие примеры, всё четко и понятно. Спасибо!

  • @АлексейМастяница-ы4е

    Лучшиий) спасибо за информативность и подачу

  • @Ohhhnailsss
    @Ohhhnailsss 9 місяців тому

    Вы очень здорово объясняете, спасибо 🙏

  • @СветланаАндреевна-х8р

    Спасибо вам за ваши полезные видео по react!

  • @andrewsam224
    @andrewsam224 Рік тому

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

  • @vladislavdukhovnik8479
    @vladislavdukhovnik8479 2 роки тому

    Михаил, спасибо большое за ваш труд

  • @gritsienkooleg3447
    @gritsienkooleg3447 2 роки тому +3

    Ох, реально, какие золотые самородки у нас есть, какое везение попасть на этот канал) У меня в группе все ваши видосы рекомендуют ⭐

  • @makhmudovasrorjon
    @makhmudovasrorjon 3 роки тому

    Здравствуйте Михаил! Спасибо огромное за ролик. Нашел ответ которую долго искал. В ролике все сказано коротка и четка. Буду ждать еще ролики про React Redux. Основная логика и пару примеры!!!

    • @mishanep
      @mishanep  3 роки тому

      Здравствуйте. На канале есть 3 видео по React redux, в формате redux toolkit

  • @Квантоваяопределенность

    Как всегда, на высшем уровне.

  • @mrfloppy-t7s
    @mrfloppy-t7s 2 роки тому

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

  • @sergey9784
    @sergey9784 Рік тому

    Замечательно разъяснено ! спасибо

  • @lesharper8751
    @lesharper8751 3 роки тому +9

    Расскажите пожалуйста про Protected Route в v6, как можно настроить защищенный маршрут, например личного кабинета/профиля

  • @МахмудЕблоев
    @МахмудЕблоев Рік тому

    Спасибо! Вроде разобрался! А что не понял, вернусь пересмотрю!

  • @АдрейСтецюра
    @АдрейСтецюра 2 роки тому

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

  • @chikichik4164
    @chikichik4164 2 роки тому

    Очень ясно и понятно. Спасибо!

  • @vladvoloshenko5701
    @vladvoloshenko5701 2 роки тому

    спасибо:)
    приятно смотреть, отличная подача

  • @murcha5899
    @murcha5899 2 роки тому

    спасибо) так внятно и детально))

  • @hugo-gf8xe
    @hugo-gf8xe 2 роки тому

    Спасибо большое это видео очень помог мне в работе

  • @dendirob
    @dendirob Рік тому

    Спасибо, интересно и понятно

  • @kodmanspp6724
    @kodmanspp6724 3 роки тому

    очень крутой контент, посоветую друзьям!

  • @Igor-uc8jc
    @Igor-uc8jc 3 роки тому

    Отлично объясняешь, лайк

  • @annasahradyan9849
    @annasahradyan9849 3 роки тому

    спасибо большое за ваш труд

  • @викторпотапов-ы6д
    @викторпотапов-ы6д 2 роки тому

    огромное спасибо за ролик)

  • @gamspi9591
    @gamspi9591 2 роки тому

    спасибо большое за материал.

  • @robx_001
    @robx_001 2 роки тому

    очень хорошо объяснил. 👌

  • @LukyTXN
    @LukyTXN 2 роки тому

    Спасибо за инфу, очень понятно объясняете. Сделайте пожалуйста разбор как вы создаете новый пост. Editpost разобрали, а добавление нет. Либо сообщите если вы уже делали подобный разбор. Еще раз спасибо за уроки, подача без воды, но с подробными примерами, то что надо. Плюс хорошая дикция, что не может не радовать.
    А еще "слэшик" ))

    • @mishanep
      @mishanep  2 роки тому +1

      В этом же плейлисте есть видео по обновленной версии роутинга - 6.4. Их три и среди них было видео по добавлению сущностей, если правильно помню.
      В принципе, это может быть просто роут, на любой адрес. А логика по работе с сервером может быть описана десятком разных способов. С точки зрения роутинга, создание проще, чем редактирование.
      /posts/create
      /posts/:postId/edit

  • @СергейФилимонов-ш9д

    Спасибо! очень полезное видео

  • @Bakhshyan
    @Bakhshyan Рік тому

    шикарно !

  • @blackwood8816
    @blackwood8816 2 роки тому

    Огонь 🔥

  • @krasnokutsky-denis
    @krasnokutsky-denis 2 роки тому

    огромное спасибо вам

  • @AlekseiVavulo
    @AlekseiVavulo 6 місяців тому

    Миша, продолжай))

  • @andrewsam224
    @andrewsam224 Рік тому

    Миша ты лучший!!!

  • @ВаняГурьянов-щ5ы
    @ВаняГурьянов-щ5ы 3 роки тому +1

    Михаил, у вас отлично получается донести информацию! И приятный тембр голоса, что важно! Подписался!
    Скажите, это у вас цветовая схема готовая или кастомно настраивали? Очень понравилось сочетание цветов! И подскажите, пожалуйста, как называется шрифт, который вы используте?

    • @mishanep
      @mishanep  3 роки тому +1

      Это тема Codesandbox. С её дефолтными цветами и шрифтами.

    • @ВаняГурьянов-щ5ы
      @ВаняГурьянов-щ5ы 3 роки тому

      @@mishanep Спасибо!

  • @Kavrizhka
    @Kavrizhka 2 роки тому

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

  • @ПашаКухарук-к4н

    Спсибо тебе!)

  • @SergeyPerestoronin
    @SergeyPerestoronin 3 роки тому

    Ролик в самый раз!
    Пожелание по следующим выпускам. В дополнение к reacr-router-dom v5 и redux есть ряд библиотек, облегчающих взаимодействие между ними (например connected-react-router). А есть ли нечто подобное для reacr-router-dom v6 и redux-tools? Было бы здорово осветить эту тему. Пытаюсь у себя в проекте наладить такое взаимодействие, но остаётся ощущение, что либо изобретаю велосипед, либо создаю ненужные костыли.

  • @RewCSharp
    @RewCSharp 11 місяців тому

    Плюс к предыдущему сообщению, я не могу обернуть мои ссылки в Route, тк возникает ошибка ([Layout] is not a component. All component children of must be a or ) и я могу пока только под BrowserRouter прописать мои ссылки по причине этой самой ошибки. Не подскажите, как можно исправить это, пожалуйста

  • @dimalukashenko4865
    @dimalukashenko4865 3 роки тому

    Спасибо, хорошее видео

  • @dima_sand
    @dima_sand 3 роки тому

    однозначно лайк

  • @RewCSharp
    @RewCSharp 11 місяців тому

    Михаил, здравствуйте. Подскажите пожалуйста, если можно. Я делаю проект и первая страница у меня это (без шапки сайта, как у вас) список новостей, а вторая страница - это как раз, как у вас, когда мы кликаем на каждую новость и переходим по ней (в ее описание) . У меня как раз этот момент не отрабатывает как надо, так как когда я кликаю по новости у меня сам список новостей никуда не девается, а само описание новости (вторая страница) просто рендерится под списком новостей. Что я мог сделать не так? Я тут уже все передумал

  • @garikmelqonyan9130
    @garikmelqonyan9130 2 роки тому

    Great tutorial

  • @MimakaGamleT
    @MimakaGamleT 3 роки тому +1

    Спасибо! Очень приятно смотреть и слушать. Прекрассный рассказчик, понятное объснение. Разрешите вопрос: при переходе на "posts/new", "posts/:id" и т.д. ссылка "Blog" в заголовке теряет стиль "активности", но по логике - должна бы оставаться активной (я же не перешел в Home или About). Как этого добиться? Менять порядок вызова хука useMatch в компоненте CutomLInk (из предыдущего видео)? Спасибо)

    • @mishanep
      @mishanep  3 роки тому +2

      Здравствуйте.
      Да, всё верно. CustomLink надо слегка доработать. Как именно - в последнем видео цикла, либо на гитхабе =)
      Рад, что вам нравятся мои видео.

    • @MimakaGamleT
      @MimakaGamleT 3 роки тому

      @@mishanep Спасибо) Очень нравятся!

  • @ЕвгенийЦезарь-г7с

    Здравствуйте, у меня вопрос, я делаю макет сайта и там есть страница с описанием товара(картинки, текст и тд), но текст у меня отображается как надо, а вот картинки с базы данных грузятся только, если вставить ссылку, а не путь к изображению, и причем абсолютно любое изображение, которое я вставляю на страницу тоже не грузится, попробовал на других страницах, в которых я не получаю id и там все хорошо работает, в чем может быть проблема, кто такое решал?

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

    Спасибо.

  • @colnbluth-bx8nt
    @colnbluth-bx8nt 2 роки тому +1

    Спасибо за классный контент.
    Жаль v6 не поддерживает опциональные параметры:/
    Переход с v5 совсем не такой плавный, как хотелось бы.

  • @lottyskound9395
    @lottyskound9395 2 роки тому

    Михаил, а что у вас за сниппеты для реакта? Они вписывают имя компонента..... интересно

    • @mishanep
      @mishanep  2 роки тому

      Самописные =)
      У меня есть расширения со сниппетами React 17, но я не помню что конкретно использовалось в этом видео. Сейчас я в основном собственными сниппетами пользуюсь.

  • @CoreProgramDream
    @CoreProgramDream 2 роки тому +1

    Привет, как всегда очень интересно 🐳
    Я что-то немного запуталась, а сколько всего есть хуков? Я знаю только 7, а тут появился новый 🧐

    • @mishanep
      @mishanep  2 роки тому +1

      Есть хуки самой библиотеки Реакт, есть хуки у вспомогательных библиотек (в данном случае роутинга). С выходом новых версий api частно претерпевает изменения, добавляются новые хуки, а старые иногда исчезают.

    • @CoreProgramDream
      @CoreProgramDream 2 роки тому

      @@mishanep Аааа.. Понятно, точно. Хуки же можно создавать самостоятельно. Почему бы Route не создать свои. Спасибо)

  • @vvlrff
    @vvlrff 2 роки тому

    спасибо!!!!!

  • @sivkaburka1062
    @sivkaburka1062 2 роки тому

    Скажите, пожалуйста, зачем писать конструкцию post && ...(то, что нам нужно). Зачем на левую часть перед && писать?

    • @mishanep
      @mishanep  2 роки тому +1

      Если post будет undefined, то post.id выдаст ошибку и приложение упадёт.

    • @sivkaburka1062
      @sivkaburka1062 2 роки тому

      @@mishanep спасибо большое!

  • @lesharper8751
    @lesharper8751 3 роки тому

    Интересно, а такая логика подойдет для создания бесед чата? Например есть массив бесед, который выводится на экран пользователя, а когда он на нее нажимает, открывается уже сам чат со своим сокет соединением и своими участниками

    • @mishanep
      @mishanep  3 роки тому +1

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

  • @ivanmochalov7129
    @ivanmochalov7129 Рік тому

    Михаил, а где посмотреть, как вы настраивали использование таких настроек как _rafce для создание react компонентов?

    • @mishanep
      @mishanep  Рік тому

      Это сниппеты. В данном случае установленные через плагин. Там длинное название, включает react redux snippet. Точное название не помню.

  • @utulov
    @utulov 3 роки тому

    Михаил, в чем может быть проблема, если сделал все правильно, а ссылка выводимого урла страницы такая href="/posts/${post.id}", то есть - не отрабатывается. при этом отдельно id и другие данные на странице со списком выводятся. Куда копать?)

    • @mishanep
      @mishanep  3 роки тому

      Мало информации чтобы разобраться. Если речь про компонент Link, то вместо атрибута href надо использовать to. А вместо двойных кавычек косые, чтобы шаблонные строки работали.

  • @КостяКонев-з1н
    @КостяКонев-з1н 2 роки тому

    Добрый день! Подскажите, все сделал как в видео, но когда добавляю SinglePage в верстку и дописываю какое-то значение после posts - да, верстка с SinglePage отображается, но пропадает вся шапка. В чем может быть проблема?

    • @mishanep
      @mishanep  2 роки тому

      Приветствую. По описанию не понимаю о каком именно изменении идёт речь.

    • @КостяКонев-з1н
      @КостяКонев-з1н 2 роки тому

      @@mishanep Я разобрался. Были подключены стили в index.html, в этом была проблема. Когда подключил в index.jsx, все стало работать как в уроке. Спасибо за отличное объяснение!

  • @НиколайМиров-т3т
    @НиколайМиров-т3т 2 роки тому

    А как быть если в моем компоненте наследование класса от Component и есть state. useParams с Component не дружит в componentdidmount. Как правильно поступить? Переписывать компонент без наследования и что делать со state? Я новичок помогите люди умные)

  • @skeelo3157
    @skeelo3157 Рік тому

    Как редиректить на 404 если мы указали айди не существующего поста, например '/posts/4242'

    • @mishanep
      @mishanep  Рік тому

      Обрабатываете ошибку от сервера и делаете редирект. Нюансы навигации разбираются в данном плей-листе.

  • @sidndb
    @sidndb 11 місяців тому

    Шо робити якщо перехожих по route з условія но фото там не показуєця

  • @DmitriyDev
    @DmitriyDev 2 роки тому

    как сделать в классовом компоненте, в нём хуки не доступны

    • @mishanep
      @mishanep  2 роки тому

      reactrouter.com/docs/en/v6/faq#what-happened-to-withrouter-i-need-it
      Дока предлагает самостоятельно создать HOC и обернуть в него классовый компонент.

  • @vitaliyskorickiy8701
    @vitaliyskorickiy8701 3 роки тому

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

  • @АлександрЮсюз-я8м
    @АлександрЮсюз-я8м 3 роки тому

    как можно сделать параметр по умолчанию?

    • @mishanep
      @mishanep  3 роки тому

      Например через конструкцию ИЛИ.

  • @Konstantin19877
    @Konstantin19877 2 роки тому

    Спасибо за демо

  • @АлександрВидин-с6я

    Актуальный канал.

  • @_mikser
    @_mikser 2 роки тому

    Как тут 10 лайков поставить ?

  • @evgeniylysiuk755
    @evgeniylysiuk755 Рік тому

    Ян Непомнящий не родственник тебе случайно ? ))

  • @Art-bm3lt
    @Art-bm3lt 2 роки тому

    +

  • @Serega5j
    @Serega5j 2 роки тому

    Я так и не понял какую функцию выполняет useParams?. Название говорящее но функционал фуу, я не вижу того что ожидал.

  • @binigersbinigers5973
    @binigersbinigers5973 2 роки тому +1

    для начинающих сложно. А для знающих неинтересно.

    • @kirillbazavlutskiy6656
      @kirillbazavlutskiy6656 2 роки тому +1

      А мне нужно и тут всё быстро и ясно объяснили

  • @seregaeinwanderer910
    @seregaeinwanderer910 Рік тому

    Hi. Может кто знает, если например index сделать posts и через link to ={id} перейти, пропадает isActive. Как с этим бороться? Кроме .

  • @Eweeeeewwww
    @Eweeeeewwww Рік тому

    Здравствуйте курсы по js react redux typescript и интсрументы разработчика на степике актуальны на 2023 год, ответьте пожалуйста

    • @mishanep
      @mishanep  Рік тому +1

      Здравствуйте. Redux и Typescript были записаны только в прошлом году. По JS - курс вряд ли устареет, так как основы языка не изменятся. Реакт у меня по 17й версии, на которой сегодня работает большинство проектов. В инструментах разработчика возможно Vs code несколько обновился, в остальном должно быть актуально.

  • @Scrappycoco
    @Scrappycoco 2 роки тому

    Большое спасибо, очень помог!

  • @SkeletikOmletik
    @SkeletikOmletik 2 місяці тому

    Спасибо большое за информацию 🎉🎉