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

[@Ivanesenses]

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

[@ДанилДмитриев-я5м]

как успехи

[@Ivanesenses]

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

[@ДанилДмитриев-я5м]

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

[@es7729]

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

[@andrewsam224]

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

[@ТатьянаРусак-ш5ю]

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

[@nevrox6197]

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

[@vladick4272]

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

[@aleksprimetv]

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

[@vladick4272]

@@aleksprimetv congratulations 🎉🍾🎈

[@Sergey_Klimov]

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

[@three-zeros]

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

[@mishanep]

Спасибо =)

[@andrewsam224]

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

[@antonchudinov2057]

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

[@Moishe_Rubinstein]

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

[@RonaMelone]

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

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

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

[@Ohhhnailsss]

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

[@МахмудЕблоев]

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

[@mrfloppy-t7s]

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

[@flavkaa2017]

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

[@alsusayfulina1865]

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

[@The14Some1]

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

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

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

[@sergey9784]

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

[@gritsienkooleg3447]

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

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

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

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

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

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

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

[@vladislavdukhovnik8479]

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

[@AlekseiVavulo]

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

[@lesharper8751]

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

[@andrewsam224]

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

[@dendirob]

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

[@АдрейСтецюра]

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

[@murcha5899]

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

[@krasnokutsky-denis]

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

[@Bakhshyan]

шикарно !

[@chikichik4164]

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

[@blackwood8816]

Огонь 🔥

[@викторпотапов-ы6д]

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

[@Kavrizhka]

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

[@hugo-gf8xe]

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

[@vladvoloshenko5701]

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

[@kodmanspp6724]

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

[@makhmudovasrorjon]

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

[@mishanep]

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

[@gamspi9591]

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

[@ВаняГурьянов-щ5ы]

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

[@mishanep]

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

[@ВаняГурьянов-щ5ы]

@@mishanep Спасибо!

[@Igor-uc8jc]

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

[@LukyTXN]

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

[@mishanep]

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

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

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

[@robx_001]

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

[@annasahradyan9849]

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

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

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

[@SergeyPerestoronin]

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

[@dima_sand]

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

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

Спасибо.

[@MimakaGamleT]

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

[@mishanep]

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

[@MimakaGamleT]

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

[@garikmelqonyan9130]

Great tutorial

[@dimalukashenko4865]

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

[@RewCSharp]

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

[@vvlrff]

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

[@colnbluth-bx8nt]

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

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

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

[@lottyskound9395]

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

[@mishanep]

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

[@Taktweider]

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

[@mishanep]

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

[@Taktweider]

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

[@ivanmochalov7129]

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

[@mishanep]

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

[@Konstantin19877]

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

[@RewCSharp]

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

[@utulov]

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

[@mishanep]

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

[@КостяКонев-з1н]

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

[@mishanep]

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

[@КостяКонев-з1н]

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

[@lesharper8751]

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

[@mishanep]

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

[@skeelo3157]

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

[@mishanep]

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

[@vitaliyskorickiy8701]

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

[@НиколайМиров-т3т]

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

[@sivkaburka1062]

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

[@mishanep]

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

[@sivkaburka1062]

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

[@sidndb]

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

[@DmitriyDev]

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

[@mishanep]

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

[@АлександрЮсюз-я8м]

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

[@mishanep]

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

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

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

[@_mikser]

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

[@evgeniylysiuk755]

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

[@mishanep]

Нет

[@Art-bm3lt]

+

[@Serega5j]

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

[@binigersbinigers5973]

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

[@kirillbazavlutskiy6656]

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

[@seregaeinwanderer910]

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

[@Eweeeeewwww]

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

[@mishanep]

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

[@Scrappycoco]

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

[@SkeletikOmletik]

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