20. Уроки React JS (NavLink) - react курсы бесплатно

🚀Стань квалифицированным разработчиком за 9+ месяцев с трудоустройством в IT -INCUBATOR:
Front-end
it-incubator.io/front-end/?ut...
Back-end
it-incubator.io/back-end/?utm...
Поддержать меня можно на:
Patreon / itkamasutra
Boosty boosty.to/itkamasutra
или оформив спонсорство на данном канале.
Помогайте друг другу вот здесь: t.me/reactjs_samurai
Уроки по React JS: • Курс "React JS - путь ...
* Сайты:
it-kamasutra.com
it-incubator.eu
samuraijs.com
* Мы в соц. сетях:
itkamasutra
/ itkamasutra
telegram.me/itkamasutra
* Мои личные VK и Insta:
d.kuzyuberdin
/ it.kamasutra.dimych
#reactJS #практика #примеры #уроки #курс

[@user-ho6di3qg7m]

у кого в конце 21го не работает activeClassName - необходимо заменить на className = { navData => navData.isActive ? s.active : s.item } + пишем правило в css для .active {color: gold;} + там же переименовываем ".item a" просто в ".item" тоже можно заменить на просто , от класснэйма тут толку не будет

[@nikolyovin]

благодарю!

[@adambenson5098]

помогло, но только с чем это может быть связано(что не работало)? P.S. у меня VS CODE

[@user-ho6di3qg7m]

@@adambenson5098 новая версия (6) реакт роут дома имеет новый синтаксис

[@miraigrafit7865]

А что такое navData? И откуда она берется?

[@adambenson5098]

@@miraigrafit7865 Медведь ответь )

[@workworker1006]

Красава! Первые курсы которые как наркотик хочется еще после каждого видоса! Чувак продолжай в том же духе..................

[@ITKAMASUTRA]

Спасибо за сравнение)

[@slaventiypchelkin4625]

Спустился по Вене на Reactивной лодке

[@Drezerak]

Ты осторожней, а то его курсы запретят ещё!

[@user-bm4mm7zd4c]

@@Drezerak потому что это бомба)))

[@_laled_3620]

@@ITKAMASUTRA raect-router-dom обновили или чо, почему Route не срабатывает????

[@user-bb9rn9on9w]

Эта песня с заставки врезается в память пробивая себе путь мечами

[@user-ff4kw3kz8d]

А слышал песенку с курса 'js с нуля, ну ваще с нуля'?

[@user-yz9tt6fq9s]

май 2023 .item a:active, .item a:focus { color: gold; } Просто добавляем стиль при активной ссылке и фокусе. Зачем усложнять тернарным оператором и лишними выражениями?

[@sailoks8411]

рил

[@bomenine2846]

прекрасно!

[@denissemeniuchenko9722]

Мне кажется, что "дизы" какие-то косоглазые ставят, которые в "палец вверх" попасть не могут. Димыч как всегда на уровне. Шикардос)

[@neverborin]

Это продавцы платных курсов по Реакту =)

[@supitacantora413]

@@neverborin например HTML Academy, оч хриновая канторка, зато очень раскрученные!!

[@user-pd9no5ye5g]

@@neverborin хотя и сами тут нибось учатся )

[@TheMalekula]

@@supitacantora413 у них тренажеры норм . Многое понятнее стало только там . А так везде дерьмище тоже самое . попал на гикбрейнсе на лектора который заикался и еще связь плохая была.....лучше бы димычу эти 17 тыщ отдал

[@user-mc1zd3mb1l]

Дизы тоже вроде хорошо, ютуб активность по модулю смотрит, ему лишь бы кликали Дмитрий и правда крут. (коменты тоже вроде за клики идут)

[@random9823]

Чувствуется уже мощность Реакта )) Супер !!!

[@dizelvinable]

Но многое ещё впереди, по-моему

[@72_stroyka]

Можно еще задать через псевдокласс Focus (Определяет стиль для элемента получающего фокус) .item a:focus { color: gold; }

[@fortuna184]

спасибо, это css, тоже работает

[@jeka_evgeniy]

Так даже проще. Спасибо!

[@ravspn]

Топ,лучший,встречу в Минске проставлю пивас))

[@ITKAMASUTRA]

🙏😂 спасибо))

[@hennadiipetrov1967]

)) Моя девушка с подружкой встретят в Киеве, поставят пивас))

[@eugenekuhot9320]

@@ITKAMASUTRA Встречу в Кракове, накрою стол) Я уже третий день хожу как зомби из-за недосыпа, причиной которому являются твои курсы) Спасибо ещё раз!

[@maxkos6184]

Встречу в Памплоне, проведу ховинчо (это когда по барам ходят и пиво/вино пьют)!

[@user-yw4jn4bg3v]

встречу в Москве , Дагестанским хинкалом угощу )

[@indigosay]

Мы в 2020 году: чувство, что ты смотришь топовый сериал, который уже вышел полностью год назад, поэтому ты залипаешь сутками, смотришь по 20 серий в день)

[@Itpedie]

какие успехи?

[@indigosay]

@@Itpedie я пока работать не спешу идти, хотя мог бы пойти, так как знаю nodejs, reactjs, typescript. Изначально пришёл программировать, чтобы делать свои проекты))) Сейчас учу вообще ретушь в фотошопе. Хочу найти парт-тайм-джоб чтобы было время на эти свои проекты))) разрываюсь между фотошопом и программированием покамест) решил год ещё поэкспериментировать

[@arsshon6842]

По 20 серий? Ты хоть что то понимал или успевал за ним?😄

[@firepixel9701]

ааааа я в транспорте поймал себя на том что читая про js напевал эту песню. Спасибо за уроки.

[@ArtemSawatzki]

Твой курс заходит на ура. Спасибо сенсэй! Шух шух шух шух)))

[@at3c863]

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

[@mk3mk3mk]

Кабзда как важно!!

[@3PuY]

Что за праздник , каждый день по выпуск! Лайк!))

[@user-dq3rc1xu7b]

Все получилось. Хорошо, что люди комменты оставляют, а то в 2023 году есть изменения.

[@ihorshylov8362]

Спасибо, как всегда видео топ! Про конспект ты прав, нужное дело!

[@ivstvl]

по второму разу смотрю, на реальных проектах полезно вспомнить. Спасибо, что так подробно всё :)

[@nehilspirit435]

Спасибо) Урок зашел легко) Летим дальше))

[@slavasemushin]

Просмотрел 20 уроков! Спасибо! Собираюсь посмотреть все. Рад, что в последних уроках стало больше нового материала!

[@bessuka]

Пройдя за пол года HTML CSS JS, наверное базу, и взявшись за React я неделю искал курсы чтоб хоть что то понять, и думал уже что это мб не мое... но где то увидел комментарий, про этот канал, зашел, и тут все так разжевывают, что даже не передать той радости когда ты начинаешь что то понимать, и то чувство в груди, которое даже не описать, когда ты хочешь смотреть дальше, и это так интересно и легко, дальше будет сложнее, но блин, так преподнести базу для новичка, что то новое всегда надо так преподносить, этот склад ума как у Димыча, это редкий дар, или наработанный путем длительного опыта в сфере преподавания, опять же ОПЫТ, чувство к мелочам и умение проводить так аналогии чтобы даже самый ленивый или самый прямой склад ума мог понять и осознать как все работает изнутри. Важно чтобы каждый из нас подчерпнул себе не только знания которые дает нам автор этого канала, но и человеческие качества которые есть у него. Желаю Димычу чтобы он получал по заслугам :) в прямом смысле крч

[@user-jq8jc8ow2o]

Такой позитивный человек, спасибо за труд)

[@pashabezk]

2022. Спасибо большое! Очень грустно, что часть видео из-за нововведений становится неактуальной. И огромное спасибо людям в комментариях, которые помогают увидеть изменения

[@teizer1122]

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

[@Gazovchik]

Добрый вечер Плюсую автору комментария, а ко второму автору вопрос - что такое всм?

[@teizer1122]

@@Gazovchik слово такое

[@user-cw1vx8ew8j]

@@Gazovchik "всмысле"

[@Gazovchik]

@@user-cw1vx8ew8j , Ясненько Спасибо

[@AndreiS-cu2wb]

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

[@user-cf4nc1hg4v]

Шикарные уроки. Как же круто, когда видишь свои успехи наглядно, сразу после просмотра курса

[@olegthesheriff]

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

[@vladpobidash]

Отличный урок, рад открывать с каждым уроком прелести React! Как же я доволен и благодарен тебе, Димыч, за уроки! Вся верстка и js что я учил до это просто такая шелуха, а сейчас прям точно еду на крутой тачке и благодаря Димычу понимаю как она работает!

[@theWorldIsMultivariate]

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

[@vitaliy6233]

За день на одном дыхании прошел до 20 урока, все очень доходчиво спасибо!

[@Abdul-hy4cy]

Спасибо за курс. Когда слушаю твои разговорные видео, как например 17 видео из машины прям заряжаешь мотивацией учиться и помимо мотивации которая у меня и так есть. Ещё твоя добавляется и появляются силы ещё работать. Не знаю как ты так делаешь. Спасибо

[@vladimirm4074]

Спасибо. Уроки шикарные.

[@user-vt4yb9ee2y]

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

[@user-jj9pm4zz2p]

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

[@4press]

Смотрим, пилим, все получается!

[@user-ts9ue4dy2e]

Уроки просто класс, а в свете апдэйтов Реакта настоящая камасутра, и смысл не просто скопировать код из комментариев, а добраться до ответа почему же так! И огромное спасибо тем, кто скидывает дополнительный материал по изменениям в React!!!

[@Gazovchik]

Добрый вечер ++

[@laboptyka3706]

Димыч! как же круто ты все нам объясняешь и показываешь! Огромное тебе спасибо что помогаешь новичкам!!!

[@user-wg1wg7uy3s]

Супер!!! Как же мне нравится этот курс. Все получается, все работает. Спасибо за курс.

[@user-qb1nw7lw9h]

Смотрю данный курс в 2022, МЕГАКРУТО, Спасибо большое автору, а также отдельное спасибо тем людям в комментах, которые выкладывают код с учетом обновления React и всего прочего )))

[@sepyk]

Дімич дякую! ПРивіт зі Львова!

[@skynet2795]

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

[@user-us3qe7ip4t]

Дмитрий! Спасибо огромное за курс! С Удовольствием смотрю его! Лучше всего всем кто смотрит, поставьте скорость воспроизведения 0,5 - совершенно по другому воспринимается! ))))

[@user-pn2wz2ns8q]

Димыч - человечище!!!! Красавчик. Благодаря первым, примерно, 30 урокам сделал тестовое при устройстве на работу. Успешно принят на должность джуниора фронтэндера. СПАСИБИЩЕ за твой труд! Все благодаря твоим урокам. Бомби дальше!

[@robloru973]

С первого видеоурока веду конспект, без него ничего в памяти не остается :D Спасибо!

[@ITKAMASUTRA]

Конспект - мастхэв! Молодец

[@AliaksandrSnipau]

отличный курс, сложное становится понятным)) Версии меняются, но это только помогает закреплять материал. У меня NavLink такой получился: isActive ? `${s.active} ${s.navListLink}` : s.navListLink} to="/profile">Profile `${s.active} ${s.navListLink}` - шаблонная строка с составным селектором, что бы применялись значения двух классов

[@scorpyraco5643]

Красавчик! Всё круто! идем дальше!

[@user-zq6nr9zy2u]

Не поленюсь и напишу.)) Большое спасибо за данный курс. Прям чувствую прокачку навыков и знаний.

[@user-rg1jw3xq7b]

Димыч то что нужно было !

[@shamilsalakhutdinov5519]

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

[@domlk_237]

Дымыч, отлично! Летим дальше)) Спасибо, за доступность

[@user-lv1td2gx8x]

Очень круто и понятно! Спасибо!

[@ITKAMASUTRA]

на здоровье

[@antonbarbakov9848]

Спасибо Димич, ты крут!!!

[@vladim1]

Димыч, у Вас дар учителя, простые объяснения для сложных вещей. Пока все понятно буквально на лету. Большое спасибо!

[@Pashkathebest]

Просмотрю ещё раз. Спасибо огромное! Успеха тебе в добрых делах!

[@user-pd9no5ye5g]

смотрю запоем, как когда-то "Во все тяжкие" спасибо за курс)

[@Dozortsev]

Спасибо! Всё круто!

[@reutoffreutoff4549]

Добрался таки до этого курса) делаю уроки с удовольствием

[@user-wj6ue7nt5g]

Блин я из за тебя ночами не сплю) Невозможно оторваться))) Спасибо дружище!

[@erythyl]

Ну что тут сказать, лайк + подписка, спасибо )

[@viktorshatalov1920]

опять крутяк!!!!спасибо!!

[@samolevich]

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

[@veronikas.1347]

Круто, что ошибки разбираешь "в эфире". Это очень помогает понимать куда лезть, де че искать и тп

[@Dmytro-cy3hy]

Я возможно буду в этом курсе часто оставлять комментарии хотя я не любитель этого, но видосы Димыча будто просят оставить положительный коммент. Курс нацелен на людей которые изучают Front-end от силы месяца 3, поэтому советы которые говорит Димыч очень полезные. От себя могу добавить что на его видосы в день можно тратить не больше 4-х часов, да так будет дольше, но я вас уверяю так вы намного лучше выучите. Я когда начинал тратил по 8+ часов на теорию и думал, что очень много выучил, но нет на следующий день всё забывал, а когда понемногу то вы всё запомните. Также конспект очень важная вещь и помощник тем кто только начинает, я хоть в этом и не нуждаюсь но делаю, потому что так легче запомнить. Также не надо забывать про отдых иначе вы вообще ничего не выучите, мой вам совет и график это 2 часа посмотрели потыкали и потом часик отдыха, чтобы голова полностью остыла и потом снова 2 часа также. Кто может больше делайте больше, но не рекомендую тратить на теорию больше 6-ти часов, даже после 5.5 вы уже ничего нормально воспринимать не будете. Авторы респект за то что так хорошо объясняет, жаль что мало у меня знакомых в вебе, но Димыч заполняет эту пустоту. Огромное спасибо ему, а всем кто проходит курс рекомендую рассмотреть данный график, он на первый взгляд плохой, но когда это дойдёт до автомата то ваш организм начнёт лучше всё запоминать и вы таким образом тратя меньше времени в день будете получать намного больше пользы чем когда 8 часов долбить это

[@johnmj750]

Афигенно, Димыч!!!! Спасибо тебе за поддержку!!!!

[@Obraveliss]

Решая эти ошибки которые связаны с устаревшими фишками у реакта, хорошо прокачиваешься))) Спасибо за видео

[@user-li8hl1vr1x]

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

[@ITKAMASUTRA]

Спасибо, Денис!!!!

[@workworker1006]

тоже самое

[@user-xy6nb8hc9d]

Спасибо, круто!

[@bitcoin-]

Супер!Все понятно,отличный и очень грамотный подход!

[@kitrouble]

Вот на 20 уроке я уже начинаю осознавать в чем кайф Реакта)) Спасибо огромное))) Я просто начинал писать приложение по старинке PHP + Jquery, но теперь прям думаю перепишу все на реакте... Только сначала доучимся))) + нужно понять как реакт взаимодействует с серверной частью БД и тп))) Дмитрий ОГРОМНЫЙ РЕСПЕКТ!

[@user-se5xu2zw7p]

Спасибо, классно! Решила переквалифицироваться с бэкенда на фронтенд, твои видео очень помогают! Всё так доходчиво и понятно, супер!

[@lemuriecnoname]

Почему решили из Бэка уйти?

[@johnyb8581]

и как?

[@user-mf9uc3he8b]

Новый урок))))

[@marlonbrando458]

Лайк и комментарий под видео, всё круто четко NavLink схавал, без тетрадки не смотрю твои видео, стараюсь писать по памяти и заражаюсь от тебя позитивом и энергией! =D

[@egorn6543]

Все получается, доступно и понятно. Следую советам, помаленьку сам начинаю декорировать и добовлять компоненты, которых нет в этих видеоуроках

[@alexandrcaldare8379]

It's cool man, Thanks)

[@arrowdev1042]

Ну всё, Димыч, приехали) То есть предыдущие уроки - скорость света, этот урок аж подустал ковырятся в документации по технологии в которой пока ноль. Благодарю за курс, в 2022 он усложняется. Теперь код не работает, и нужно искать уже с 20 урока настоящие решения. Такой путь самурая превратился в реальный ПУТЬ САМУРАЯ 1.2! НО не кабзда как просто.. ой не кабзда)))

[@Anastasia_Kobalt]

Кабзда, какая заморочь смотреть это в 2022! :)

[@lovefliymon9912]

а ты нашел как правильно писать код если да то скинь ссылку плиз

[@arrowdev1042]

@@lovefliymon9912 Короче удаляют мой коммент(это знаки для меня, значит ссылка не уместна). Наверное я отправляю тебе ссылку, которая не имеет смысла на данном этапе, и немного подумавши я точно понимаю что мой код не смахивает на правильный так как я просто учился и пробовал. Поэтому что ты подразумеваешь под правильным кодом? По той ссылке ты можешь найти рабочее что-то или подсмотреть как я обошел эту проблему, но за год там должно быть много чего поменялось, поэтому я думаю что мой код тоже уже не актуален, нужно смотреть на документацию и спрашивать тех кто с этим сейчас работает. В общем успехов брат.

[@user-nl2be4tv7l]

Очень интересно смотреть Ваши уроки. Огромное Вам спасибо!

[@hr9072]

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

[@user-zb7yf4rf4t]

Урок просто посмотрел, а остальное сам делал т.к. на данный момент уже используется 6 версия роутера. P.S. пример рабочего кода isActive ? `${classes.activeLink}` : `${classes.item}`} >Settings

[@dmitrbut]

спасибо, помог

[@user-xv5wc5cm6q]

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

[@web5560]

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

[@nurzatertugan1985]

иншалах у меня всё получится

[@andreyantonovich379]

Спасибо за урок!Действительно реакт это круто,раньше приходилось добавлять EventListener,потом у элемента менять свойство display: на none,потом находить другой элемент и добавлять свойство display.А тут так легко,главное понимать,что под капотом!Едем дальше!

[@kedrolit1521]

Димыч! Спасибо! Всё понятно. Так хорошо объяснил, что кажется сам смогу объяснить. Как-нибудь выиграю твой курс в инкубаторе и пойду других учить. Вот так.

[@Hayabusa17]

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

[@AisyluT]

Если используем className={({isActive}) => isActive ? classes.active : classes.item} , тo в модуле пишем .item a { color:white; text-decoration: none ; } .item a.active { color: gold ; } если не используем className, то в модуле пишем просто a:focus { color: gold;}

[@Shimbato]

все четко и ясно! спасибо

[@milenaevseeva1531]

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

[@user-xs8hj8ew3c]

Просто лучший!)) Когда читать инфу для любознательных? Разве что во вовремя сна) Твои видео комфортнее смотреть залпом! Атмосфера работы невероятная, а твоя энергия просто мегапушка!

[@ivanmiarkulau8320]

удобно использовать NavLink для организации переходов по страницам в ReactJS, спасибо за урок!)

[@sh0ny]

Бусидо 54 передает привет! Летим дальше! Для активной ссылки в css нужно прописать следующее .item a:focus {color: #eae6e6; text-decoration: none; font-weight: bold; }

[@paljm345]

И так, начинаю свой путь от домохозяйки знающей базовые основы JS до джуна ReactJS. Увидим на каком уроке, мне удастся устроиться на работу. П.с. Буду писать этот пост под каждым видео. БОМБИМ.

[@awesomeuser789]

Привет! Как успехи? Может уже устроился?

[@user-cx4hh1cg7f]

Спасибо, Димыч! Как всегда круто. Летим дальше!

[@Marv3L_777]

Спасибо за курс!) Бомбим

[@dmytrorudniev4040]

"Нормальными адекватными..." самураями!

[@arturnureyev5224]

В 6ом React Route пропал activeClassName Теперь по другому Здесь есть инфа kzbin.info/www/bejne/sHa0moF8dtx3fdE

[@user-wx9rr7nc6z]

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

[@CHEBURAT0OR]

Спасибо, дружище!

[@Obraveliss]

Спасибо Спас от бессоных ночей

[@Lotpite]

Спасибо. Четко объяснил :-)

[@user-fx8ex2qj6z]

спасибо братан,инфа поступила во время!

[@user-dk2hf9ro2z]

Все получилось! Ура! Конечно в 2022 году работает посредством функции. Спасибо Дмитрий!

[@andrewivan5423]

Спасибо большое , бомбим дальше)

[@dimitry5479]

В 22году не работает activeClassName? Необходимо заменить на: className = { navData => navData.isActive ? s.active : s.item } + пишем правило в css: .item a.active {color:gold};

[@white5096]

спасибо, помогло!

[@andreicritick7968]

Всё класс, спасибо за потраченное Вами время! Но, пока я не добрался до актуального на сегодняшний день завершения курса, меня терзает вопрос: фронт, это, бесспорно, супер, но что насчёт бэка? Например, создание динамики постов, добавление аватара и прочее, и прочее?.. Будет ли это в курсе?

[@ITKAMASUTRA]

Конечно! Потому что полноценно сделать проект и научиться на нём, если нет взаимодействия с серваком, нельзя!!! Вас ждёт в рамках этого курса много чего интересного!!! Летите дальше!!!

[@andreicritick7968]

@@ITKAMASUTRA, тогда, кратко говоря, ЗБС! Ещё раз спасибо за Ваш труд! Я, вообще, разрабатываю темы под Wordpress, но новые веяния, подобные этому, также интересны.)

[@user-hr3ts2xg4u]

Получилось обойтись без activeClassNameю В CSS модуле прописала a[class="active"]{ color: gold; }

[@Dubik_Ks]

отлично👍, только я еще добавила a{text-decoration: none;} А то бесит)))

[@stream_ua_language_JEX_UA]

Первый канал на котором я лайкаю каждое видео, спасибо тебе огромное!

[@compot8279]

Спасибооо Дима! Ещё 80 уроков) На сегодня устал

[@user-dp6uk9ir4h]

.item{ color: white; } .item:focus{ color: rgb(22, 22, 22); } можете не менять даже jsx, в css уже есть такое свойство только надо написать focus работает одинаково

[@birmi]

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

[@nadinbacanova9021]

Спасибо, спасли!

[@user-dz3wr9vp6w]

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

[@didikha]

ура, я прошла 20 уроков!

[@user-nh3cq9it6e]

Со всем разобрался и доделал все для остальных ссылок и сделал компоненты без затруднений, а все почему? потому что ни кто лучше тебя этого не обьяснил))))

[@oceanbeach5351]

12:43, у тебя лишний селектор написан, можно просто .item .active {color: gold}, он и так его найдет