React JS сайт с нуля - Роутинг сайта, переход по страницам

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

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

  • @Yond-in7ij
    @Yond-in7ij 3 года назад +141

    Для тех кто смотрит в 2022)
    Команда Switch для routre dom v6 изменилась на Routes
    Component/render на element
    Проверка теперь не по component = {Home} , а element = {}

    • @БогданПавлюк-с1р
      @БогданПавлюк-с1р 2 года назад +4

      Спасибо, долго думал что я не то написал )

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

      Брат спасибо я уже час сижу с тим Свичом

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

      Спасибо, долго думал, что это я тупой хлебушек с:

    • @Владислав-ч5д5з
      @Владислав-ч5д5з 2 года назад

      от души

    • @ВикторБогатырев-о3и
      @ВикторБогатырев-о3и 2 года назад +4

      Парни подскажите плиз, сделал через Routes^ у меня ошибка ушла со Switch связанная, но и пропала Navbar Ни на одной странице не отображается, что делать?

  • @СидхартхаГаутама
    @СидхартхаГаутама Год назад +32

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

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

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

  • @vladyslavbukhanets7185
    @vladyslavbukhanets7185 Год назад +17

    Изменения в коде на 2023 это:
    Команда Switch для routre dom v6 изменилась на Routes
    Component/render на element
    Проверка теперь не по component = {Home} , а element = {}






    Второе изменение : У кого не видно страниц, вместо fixed="top" сделать sticky="top", тогда все будет работать как надо

  • @redeyes256
    @redeyes256 3 года назад +80

    У кого не видно страниц, вместо fixed="top" сделать sticky="top", тогда все будет работать как надо. Видимо что-то внутри библиотек поменялось. Ох уж этот фронтенд)))

  • @Edvard-Aliev
    @Edvard-Aliev 4 года назад +6

    Все обходил стороной React думал сложно, сам на php laravel делаю сайты, сейчас перехожу на JS изучаю React, с твоими видео уроками очень легко понять как и что делать, и получил более плавный и легкий переход, спасибо за видео, за 3 часа переписал весь сайт с php bootstrap laravel в React!

  • @fedorsuharukov5631
    @fedorsuharukov5631 5 лет назад +7

    Алексей красавчик! выпустил 2 видео за день

  • @potatohd404
    @potatohd404 5 лет назад +3

    Леха, твои видео по react- лучшие видео на ютубе, с нетерпением жду новых выпусков!

  • @DukeSpontaneous
    @DukeSpontaneous 4 года назад +32

    С прошлого видео внезапно пропал параметр `fixed="top"`,
    а с ним текста страницы не видно.

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

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

    • @sergey-kozlov
      @sergey-kozlov 4 года назад +2

      Спасибо, это крайне важно. Похоже все тупо смотрят и сами не повторяют это локально. Я не усмотрел этот момент

    • @sergey-kozlov
      @sergey-kozlov 4 года назад +10

      @@SuprunAlexey Об этом стоило сказать в видео

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

      Полностью с тобой согласен. Вчера час потратил, несколько раз переписывал код. В итоге текста не было видно. Спасибо за комментарий :)

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

      @@SuprunAlexey Подскажите, пожалуйста, у меня этого параметра нет, а текста все равно не видно. Как сделать отступ? Ну или где может быть ошибка?

  • @mrakov
    @mrakov 5 лет назад +23

    Почему ты ничего не рассказал про возможность передачи props в компонент внутри Route, про Redirect, и то что при нажатии на ссылку страница перезагружается, потому что не вставил Link, зачем выпускать видос в 2020, ничего про базовые возможности не сказав? При этом еще все хавают это. Смотрел раньше твои уроки когда учился, этот видос что-то расстроил.

    • @Aik-bu1yi
      @Aik-bu1yi 4 года назад

      + я оболдел когда страницы начали перезагружаться целиком. как вставить линк ?

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

      @@Aik-bu1yi component

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

      @@Aik-bu1yi Home

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

    заменить на , component = { } на element = {< />} и будет работать. (Актуально, для версии react-routed-dom V6)

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

      Что то поменялось?
      Я всё поменял, всё ещё не работает

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

      @@iChepikov всё работает

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

      На самойстранице перехода что менять?

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

    На 4:51 ты прописал rcc и страница компонента заполнилась. У меня такого нет. Вопрос - как сделать так, что бы можно было сделать как ты?

    • @monolit-8346
      @monolit-8346 3 года назад

      Поищи дополнения на свой редактор. "React снипеты/дополнения на редактор кода"

  • @АлександрИванов-й4ц1ш

    React под звуки дождя) Прямо слушать на ночь)

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

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

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

    Ошибка с методом Switch.
    Attempted import error: 'Switch' is not exported from 'react-router-dom'.

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

      та же проблема что то понять не могу , пни если узнаешь

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

      один проект делал точь в точь месяц назад работает начал новый по этому же видео точь в точь и неработает {Attempted import error: 'Switch' is not exported from 'react-router-dom'.}

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

      Либо установите версию 5.2.0, вместо 6/ либо измените Switch на Routes

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

      так нашли в чем проблема?

    • @Alice-mg5hx
      @Alice-mg5hx 3 года назад +1

      @@yuliyabrueva
      Приблема в версиях. В "react-router-dom" v6, "Switch" заменили на "Routes".
      Что бы в примере из видео все заработало нужно изменить:
      1. import { ..., Switch, ... } from "react-router-dom";
      На
      import { ..., Routes, ... } from "react-router-dom";
      2.


      На это:

  • @Galina-om3jw
    @Galina-om3jw 4 года назад +3

    Добрый день! Я сделала все по видео, но в итоге, текст, указанный в компонентах папки Pages не выводится. В консоли ошибок нет. Вce устанавливала, все пути прописала... Что это может быть?

    • @Galina-om3jw
      @Galina-om3jw 4 года назад +3

      Все. Разобралась, оказалось элементарно - нужно убрать в Navbar атрибут fixed

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

      Вот и славно😇

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

      @@Galina-om3jw У меня тож такая проблема было СП за Решение Проблемы

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

    Друзья, а что делать с Link? Мы его импортируем, но нигде не используем ведь! Или я что-то упустил?

  • @ИсламМусаев-и1з
    @ИсламМусаев-и1з Год назад

    Здравствуйте, у меня такая проблема по этому видео я все написал как у вас но у меня не выходит сообщение в страница типо в Контакты, About. Все проверил все четко написанно не подскажите почему не показывает

    • @БонгиБонги
      @БонгиБонги 11 месяцев назад

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

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

    Подскажите, что за ошибка - Failed to compile
    ./src/App.js
    Module not found: Can't resolve 'bootstrap/dist/css/bootstrap.min.css' in 'E:\Programing
    eact_site\src'

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

      Привет, переустанови Bootstrap. Вот это в командную строку введи npm install react-bootstrap@next bootstrap@5.1.0. Успехов.

  • @АндрейЗык-щ1ш
    @АндрейЗык-щ1ш 2 года назад

    Приветствую, подскажи пожалуйста может уже и время прошло нотвои видео актуальны, у меня вопрос по поводу inline ----- React не видет его в ДОМ и выдаёт ошибку Warning: Received `true` for a non-boolean attribute `inline`.
    If you want to write it to the DOM, pass a string instead: inline="true" or inline={value.toString()}.
    как можно это исправить. из-за этого форма и кнопка не встают в одну линию и не заполняют во флексе весь блок

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

    Ребята, просто откройте документацию, там все тоже самое написано, и даже больше, и понятней. Семиминутное видео с содержанием "просто повторите за мной" - это НЕ урок, а инструкция.

  • @mcdba41
    @mcdba41 4 года назад +7

    Чтоб не перегружать страницы поменять
    Home
    на
    Home
    итд
    + обернуть ... в

    • @ГеоргийЧерный-ь1з
      @ГеоргийЧерный-ь1з 4 года назад

      Пытался исправить и почему то не получается...

    • @ИванСтепанов-л2ц
      @ИванСтепанов-л2ц 4 года назад +15

      *Получилось* - спс:
      import React, { Component } from 'react'
      import { Navbar, Form, Container, Nav, NavLink, Button, FormControl } from 'react-bootstrap'
      import logo from './logo192.png'
      //import { Router, Switch } from 'react-router-dom'
      import {
      BrowserRouter as Router,
      Switch,
      Route,
      Link
      } from "react-router-dom";
      import Home from '../Pages/Home.js'
      import About from '../Pages/About.js'
      import Contacts from '../Pages/Contacts.js'
      import Blog from '../Pages/Blog.js'
      export default class Header extends Component {
      render() {
      return (

      **



      React site




      Home
      About us
      Contacts
      Blog





      Search














      )
      }
      }

    • @avi.kyiv.ukraine
      @avi.kyiv.ukraine 3 года назад

      @@ИванСтепанов-л2ц Спасибо тебе, добрый человек!

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

      @@ИванСтепанов-л2ц Огромное спасибо!

  • @Pl0vec
    @Pl0vec 5 лет назад +2

    У меня не выводятся на экран слова Home, About, Contacts,Blog.Navbar fixed=“top” убран. В поисковой строке видно, что страницы переключаются. Попробовал увеличить сам текст страницы,но ничего не меняется.Что можно еще попробовать?

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

      Поменяйте на h1 что б текст больше был

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

      @@SuprunAlexey не помогает , очень странно вообщем, ощущение что страницы переключаются на стороне "сервера"(если так можно назвать)но не отображаются на экране

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

      Import проверьте, npm install react router dom делали? Link проверьте, Router, Switch, страницы

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

      @@SuprunAlexey "react-router-dom": "^5.1.2"(посмотрел в файле package.json ,как я понимаю в этом файле отображается что подключено).Я заметил при переходе по страницам , что путь к ним не напрямую чтоли(localhost:3000/about/contacts/blog/contacts/) каждый раз как я нажимаю на раздел он запоминается, на home работает нормально ( в плане пути в поисковой строке, но текст на самой странице так же не выводится)

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

      @@SuprunAlexey таже сама ситуация , Link не работает . при периключении между страницами сам раутинг работает но контент страницы ( home,about, contacts, blog) не отоброжается . раутинг и раутинг дом инсталирован

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

    Переход со страницы на страницу работает, но содержимое страницы не отображается.

  • @ДанилГребнев-о7с
    @ДанилГребнев-о7с 2 года назад

    почему при переходе у тебя обновляется страница? Разве роутинг не позволяет делать переход по страницам без обновления?

  • @ivankireev7126
    @ivankireev7126 5 лет назад +3

    Всё очень круто!
    Такой вопрос, какие плагины ты используешь в vs-code?

    • @SuprunAlexey
      @SuprunAlexey  5 лет назад +3

      ruclips.net/video/R1tRDrTYoGA/видео.html

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

    Круто, давай продолжение!

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

    Вот что делать новичку в реакт, когда у него что-то не получилось??? У меня не происходит переключение между страницами, либо содержимое не отображается, не могу понять(

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

    Спасибо большое. Пили дальше видио, очень интересно. Когда следующее видео?

  • @monolit-8346
    @monolit-8346 3 года назад +1

    "export 'Switch' (imported as 'Switch') was not found in 'react-router-dom'"
    Замените Switch на Routes

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

      все спасибо брат уже час сижу с этим Свичом

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

    Привет , такой вопрос если в вношу fixed="top" у меня не видно слово на странице Home , так как оно получается под шапкой , как исправить ?

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

      Добавить отступ сверху для слова на странице Home

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

      @@SuprunAlexey А как отступ добавить 😅 или где можно посмотреть как это делается ? Всё, разобрался Contacts

    • @КириллВасильев-к6р
      @КириллВасильев-к6р 4 года назад

      @@simplechannel693 Под Navbar добавь несколько

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

    А какая разница между этим и простой html+css страницами?

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

      В том что в react js можем реализовать логику приложения

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

      Web Developer Blog ну то есть это позже заметно будет?

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

      А сейчас не заметно разбиение на компоненты и маршрутизация?

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

      Web Developer Blog я не замечаю разницы при переходе на другую страницу

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

      Чисто визуально разницы сейчас не будет)

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

    ничего не могу понять почему у меня не отображаются страницы?? Никакой ошибки нет
    ъ

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

      Страницы отображаются но их не видно за хедером. Нужно у Navbar убрать параметр fixed-'top'. Ну или сделать отступ сверху для страниц

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

      @@poval7579 еще можно вместо fixed="top" сделать sticky="top", тогда все будет работать как надо :)

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

      @@redeyes256 Не знал, спасибо)

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

      @@redeyes256 Огромное спасибо, очень помогло!

  • @elvinalishov2176
    @elvinalishov2176 5 лет назад +2

    a koqda ubral fixed top tekst poyavilsya posle navbara

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

    У меня не выводятся на экран слова Home, About, Contacts & Blog. При этом в поисковой строке видно, что сами страницы переключаются. Где искать ошибку?

    • @SuprunAlexey
      @SuprunAlexey  5 лет назад +3

      Navbar fixed=“top”?

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

      @@SuprunAlexey Точно! Спасибо ))))

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

      Web Developer Blog а как сделать их одновременно, чтобы и navbar отображался, и текст?

    • @Виталий-р3е8р
      @Виталий-р3е8р 5 лет назад

      @@d1z3ro можно задать дивам на страницах класс какой нибудь и маргином сверху сделать отступы например.

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

      @@SuprunAlexey да . спасибо я на этом оказывается тоже попался. текст спрятался за шапкой навигации и его не видно было, два часа проковырял пока не начел другой контент пробовать на страницы вводить и потом увидел что отоброжает но текст спрятался )) . спасибо еще раз уроки , жду продолжение проекта !

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

    здрасте, а как можно сделать переключение страниц без перезагрузки? разве не в том смысл Router-а? если писать просто то дизайн Bootstrap-a падает.

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

      Імпортуйте NavLink не в react-router-dom, a в react-bootstrap.

  • @СергійСорочинський-е5к

    Сделайте урок анимации при Routings. Пожалуйста. Русских видео уроков по этой теме я не нашел. Пришлось гуглить статьи и тех на русском почти нет. Так что думаю тема новая для СНГ. Спасибо за труд.

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

    у меня вот этот код сработал, взял из коментов и немного модифицировал
    import React, { Component } from 'react'
    import { Navbar, Form, Container, Nav, NavLink, Button, FormControl } from 'react-bootstrap'
    import logo from './logo192.png'
    import {
    BrowserRouter as Router,
    Routes,
    Route,
    Link
    } from "react-router-dom";
    import Home from '../Pages/Home'
    import About from '../Pages/About'
    import Contacts from '../Pages/Contacts'
    import Blog from '../Pages/Blog'
    export default class Header extends Component {
    render() {
    return (





    React site




    Home
    About us
    Contacts
    Blog






    Search













    )
    }
    }

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

      Спасибо! Это сработало! Плюсую!

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

      огонь спасибо!

  • @larisaplatova1644
    @larisaplatova1644 8 месяцев назад

    Спасибо за информацию

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

    Здравствуйте! А подскажите, страницу отображает без ошибок, но как у вас в конце на странице не показывает HOME итд. Что не так сделала?

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

      Не понимаю проблему, пересмотрите код у меня и у вас, может блок не добавили. Я уже не помню где там home

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

    Привет! У меня не все получается. Вылетает ошибка. Вот ее текст: export 'Switch' (imported as 'Switch') was not found in 'react-router-dom'

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

      Замени Switch на Route

  • @МаксимЗавьялов-ш7с
    @МаксимЗавьялов-ш7с 2 года назад +2

    у кого не появляются слова, просто уберите fixed="top" у Navbar

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

      Надо просто заменить fixed="top" на sticky="top"

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

    Здравствуйте. Когда импортируем в header.js почему после import Home from ставится 2 точки а не одна, или это зависет от кодового редактора, у меня соблайн текст?

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

      Это зависит от расположения компонента в папке. Если две точки то мы выходим из папки что бы зайти в другую

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

    Привет , как сделать подроутинг?

  • @warface-nik4410
    @warface-nik4410 4 года назад

    у меня такой вопрос, вот в компаниях или в реальных проектах процесс разработки ведется примерно также? То есть, если есть к примеру реальный заказ можно ли можно ли по этому курсу сделать реальный проект или это что наподобие "Hello world!"??

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

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

    • @Сергійбаранчук-ю7и
      @Сергійбаранчук-ю7и 4 года назад

      Привет,а ты переходыл на opencartmasters.com/ просто что-то обсуждали по поводу твоего вопроса.

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

      Нет не переходил, посмотрю.
      Посмотрел... Не понял, пока

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

      А к чему seo, и магазины???

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

    Почему то у меня нет ошибка но и не перекулчается

  • @mmm-m2t
    @mmm-m2t 3 года назад

    Есть одна проблема, сам с ней сталкивался. А именно, перезагрузка страницы. Страница не должна перезагружаться. То есть должна происходить подмена url. Хотя, в данной ситуации может так и можно ;-;

  • @ГеоргийЧерный-ь1з
    @ГеоргийЧерный-ь1з 4 года назад

    При написании в точности как на видео у меня есть пару моментов, которые я не могу найти ошибки в кодах.
    При переключении с страниц Home Blog Contacts About , сайт перегружается от сервера ( то есть видно что переходит на другую страницу) , как исправить? вроде верно устанавливал библиотеки, на втором уроке пересматривал внимательно и все равно не то.
    Соответственно при переключении страницы - видно как ссылка переключается, но текст не выводится... Как исправить ошибку? на этом видео в точности написал код и все равно проблема

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

      Загрузи куда то код или скинь скрин

    • @ГеоргийЧерный-ь1з
      @ГеоргийЧерный-ь1з 4 года назад

      @@SuprunAlexey github.com/Joraborajora/Weather.git

    • @BohdanStelmakh-u9y
      @BohdanStelmakh-u9y 4 года назад

      @@ГеоргийЧерный-ь1з потому там не верно написан код

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

    Как работает класс 'active' для навлинка в реакте? В видео забыли добавить так мб в комментариях обясните пжлст

  • @Aik-bu1yi
    @Aik-bu1yi 4 года назад

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

    • @Сергійбаранчук-ю7и
      @Сергійбаранчук-ю7и 4 года назад

      Привет,а ты переходыл на opencartmasters.com/ просто что-то обсуждали по поводу твоего вопроса.

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

    По больше таких видео

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

    А на сколько Это профессионально , так писать код

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

    Кто знает как настроить отображение меню на всю ширину экрана в десктоп режиме?

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

    Почему роутинг из компоненты хедера ? почему не с app js после компонента хедер ?

    • @Сергійбаранчук-ю7и
      @Сергійбаранчук-ю7и 4 года назад

      Привет,а ты переходыл на opencartmasters.com/ просто что-то обсуждали по поводу твоего вопроса.

  • @ДаниилБойко-ж8ж
    @ДаниилБойко-ж8ж 5 лет назад +1

    Когда новый урок?)

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

    Swicth не компилируется , всё сделал правильно подскажите(

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

      Чел выше написал,
      "Да, оказывается что в новых версиях React Switch меняется на Routes"
      Вместо Switch пропиши Routes мне помогло

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

      @@BestMusicTheAppolo спасибо)

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

    Делаю всё как на видео, но ошибка выводится "Failed to compile
    ./src/Components/Header.js
    Module not found: Can't resolve '../Pages/Contacts' in 'C:\Users\konkatenazia\Desktop\buysadovoe.ru\src\Components'", что можно сделать. Проверил по 100 раз код, всё идентично.

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

      импортировать не забывайте. У него как и у меня большенство автоматом импортируется когда прописывает, по этому он об этом не считает нужным говорить.
      Вообще много упускает, ничего не объясняет что и зачем делает. Да и на коменты так же отвечает, на "отвали", приходится додумывать.
      Видео близко не для новичков

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

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

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

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

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

      что-то вроде
      closeButton.onclick = (event) => {
      setTimeout(destroyOrHideModalFunction(), 5000)
      }
      function destroyOrHideModalFunction() {
      yourModalWindow.parentNode.removeChild(yourModalWindow)
      // или
      yourModalWindow.remove() //не работает в IE
      // или
      yourModalWindow.style.display = 'none' // не удаляет, а просто скрывает
      }

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

      @@iksoldragon4374 спасибо. А этот способ будет работать с бутстрап?

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

      @@alexwhite6546 в целом да, но последний бы я, может быть, не использовал так как он меняет css элемента. И если понадобится открыть окно путём отмены скрытия, то желательно знать какой стиль использовался внутри бутсрапа. А внутренние детали библиотек, имхо, лучше менять в специфических случаях.

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

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

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

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

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

    Почему-то пишет что "Switch" не импортировалось с 'react-router-dom' и из-за этого весь сайт не работает

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

      А все сделали по примеру?

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

      @@SuprunAlexey Да

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

      @@prare1127 а вы нашли ошибку?

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

      @@Oly20116 Да, оказывается что в новых версиях React Switch меняется на Routes

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

    У кого возникает ошибка с Switch, установите npm install react-router-dom@5 , и всё сразу ошибка исчезнет!

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

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

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

      Спасибо

  • @jsx-tsx
    @jsx-tsx 2 года назад

    Содержимое страниц не показывало, переписал на функциональный компонент.
    меняем на , component={Home} на element={}.
    Только когда все сделал заработало.

    • @ВикторБогатырев-о3и
      @ВикторБогатырев-о3и 2 года назад

      Поменял, ошибка со Switch связанная исчезла, но Navbar не отображается, почему так?

    • @Nolik-ve6oy
      @Nolik-ve6oy Год назад

      @@ВикторБогатырев-о3и понял в чем проблема?

  • @АшотПогосян-л9м
    @АшотПогосян-л9м 5 лет назад +1

    брат а где продолжение ?

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

    Страница то все равно перезагружается, наверное, потому что в Link вместо to прописан href

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

    vi napisali i sterli fixed? pochemi?

    • @SuprunAlexey
      @SuprunAlexey  5 лет назад +2

      Потому что навбар тогда закрывает текст

    • @МаксимБезкровний-и3х
      @МаксимБезкровний-и3х 5 лет назад

      @@SuprunAlexey ,а я то думал почему у меня текст не выводится)

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

      @@SuprunAlexey блин, а сказать об этом в видео нельзя? Все думают почему же у них текст не отображается и ломают голову.

  • @BohdanStelmakh-u9y
    @BohdanStelmakh-u9y 4 года назад

    Видео про Роутинг сайта , но у тебя он не работает. Если люди понимают о чём идёт речь, то они заметят что страницы у тебя рендеряться! Но так не должно быть, ты его просто для прикола добавил?

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

    Было бы круто скачать код и сравнить со своим :С

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

    Чётенько

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

    У меня не получилось(. Но все сделал провильно

  • @ИгорьФорсенко
    @ИгорьФорсенко 2 года назад

    Routes instead of "Switch"

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

    У меня линк не работает

  • @АлексейМелентьев-ч3в

    а поч не jsx?

  • @МаксимБезкровний-и3х

    Сними продолжение)

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

    Dobriy vecher spasibo za urok u menya stranici Home Blog About ya vnix napisal nazvanie stranic no ix nevidno propodayut pod navbarom v navbare ya napisal fixed top

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

      Сделайте шрифт по больше или отступ сверху размером навбара

  • @Solo-Dun
    @Solo-Dun 5 лет назад

    Вроде лучше render а не component использовать в роутинге

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

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

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

    еее, когда некст?

  • @konstantin-vasilev
    @konstantin-vasilev 2 года назад

    Про маршрутизацию без перезагрузки страниц рассказано в этом ролике:
    ruclips.net/video/JMw0omX4QNQ/видео.html

  • @РоманПетров-й5е
    @РоманПетров-й5е 2 года назад

    return (
    .
    .
    .



    );
    }
    }

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

    Ругается на конструкцию .....

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

      hi решили проблему?

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

      @@pavelkuzin7431 да. Использовал несокращенную запись -fragment

  • @БондаренкоВалентин-н6в

    А что это за язык

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

    И ничего. просто белая страница.

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

      Тоже самое

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

      @@iamf4t4l короче там поменялся чутка синтаксис.

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

      @@iamf4t4l
      import React, { Component } from 'react';
      import { Button, FormControl, Nav, Navbar, Container, Form, NavLink, NavbarBrand } from 'react-bootstrap';
      // import Navbar.Collapse from 'react-bootstrap/esm/NavbarCollapse';
      // import Navbar.Toggle from 'react-bootstrap/esm/NavbarToggle';
      import { BrowserRouter as Router, Routes, Route, Link } from 'react-router-dom';
      import Cataas from '../Pages/Cataas';
      import Explore from '../Pages/Explore';
      import Your from '../Pages/Your';
      import About from '../Pages/About';
      import Catbutton from '../Pages/Сatbutton';
      export default class Header extends Component {
      render() {
      return (






      Cataas
      Explore
      Your Cat
      About cats
      Cat button

















      )
      }
      }
      вот тебе пример кода с моего проекта.

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

      @@elisawetabelkowa3205 thanks! У меня своеобразный баг , я уже исправил!

    • @ВикторБогатырев-о3и
      @ВикторБогатырев-о3и 2 года назад

      @@elisawetabelkowa3205 Все сделал также, ошибки исчезли, а Navbar так и не показывает, просто белый экран...

  • @igorkroshkin9354
    @igorkroshkin9354 5 лет назад +2

    одно и то же в десятый раз, отписался :(

    • @SuprunAlexey
      @SuprunAlexey  5 лет назад +3

      В смысле одно и то же??? React js практика вообще первый раз на канале

  • @костямурзиди-ш1ъ
    @костямурзиди-ш1ъ 3 года назад

    fixed-top для хедера я не применяю