React JS фундаментальный курс от А до Я

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

Комментарии • 5 тыс.

  • @АлександраМирончук-з5с
    @АлександраМирончук-з5с 11 месяцев назад +421

    лайк, кто смотрит в 2024)
    курс пушка-бомба!!!

  • @user-jt7wb3zc1m
    @user-jt7wb3zc1m 3 года назад +1461

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

    • @UlbiTV
      @UlbiTV  3 года назад +65

      Спасибо)

    • @ВсадникАпокалипсиса-я9е
      @ВсадникАпокалипсиса-я9е 3 года назад +8

      @@UlbiTV чет не понял. а редакс где? без flux-ориентированной библы это все чуть менее чем бесполезные игрушки

    • @UlbiTV
      @UlbiTV  3 года назад +55

      @@ВсадникАпокалипсиса-я9е какие глупости)) кто вам такое сказал?

    • @AlexanderOsnovnoi
      @AlexanderOsnovnoi 3 года назад +33

      @@ВсадникАпокалипсиса-я9е С какой стати? Реакт движется к тому, чтобы стать полностью самостоятельной библиотекой, без сторонних State Management систем. Разработчики отказываются от классовых компонент, добавляют хуки, это всё шаги к самостоятельности и обособленности от других фреймворков платформы

    • @digitalturkistan1857
      @digitalturkistan1857 3 года назад +10

      @@UlbiTV он классные слово знает

  • @interpol2138
    @interpol2138 2 года назад +51

    Автор лучший! Огромная работа, разбирался в каждой строчке. Спасибо больше!
    Так же в связи с датой выхода ролика, помощь молодым выкатываю ниже
    36:50
    Изменены props и теперь могут выглядит так:
    Если у кого проблема с Route/react-router v6 то теперь нужно писать так:
    2:15:18
    2:19:27
    Вместо используется
    2:20:51
    Вместо использовал
    2:23:05 (Вместо useHistory() теперь используется useNavigate()
    const navigate = useNavigate()
    function transitToPost(id) {
    navigate(`/posts/${id}`, { replace: true })
    }
    //
    transitToPost(props.post.id)}>
    Открыть

    2:25:09
    Пропс exact больше не нужен
    2:34:49(Работа с декомпозицией файлов):AppRouter.jsx
    return (

    {routes.map(route =>

    )}

    )
    И файлом router.js У автора это файл по пути ../src/Router/index.js
    export const routes = [
    { path: "/about", element: , exact: true },
    { path: "/posts", element: , exact: true },
    { path: "/posts/:id", element: , exact: true },
    { path: "/", element: , exact: true },
    { path: "*", element: , exact: true },
    ];

  • @ГеоргийАлбегов-д5к
    @ГеоргийАлбегов-д5к Год назад +134

    если кто дошел до BrowserRouter, то теперь делают вот так:

    • @infindery
      @infindery 7 месяцев назад +1

      Спасибо

    • @EvilYou
      @EvilYou 7 месяцев назад +13

      А вот как можно делать редирект:

    • @eriksitnikov3185
      @eriksitnikov3185 25 дней назад +1

      Я только начал писат такой комментарий, и тут увидел твой. Благодарю

    • @ДмитрийПриходько-у7к
      @ДмитрийПриходько-у7к 17 дней назад

      Спасибо тебе огромное

  • @дмитрийшикалов-о5у
    @дмитрийшикалов-о5у 2 года назад +406

    Огромное спасибо автору!!! Проходил React на курсах и много из видео знаю, но твои примеры и советы помогают сложить пазл из каши полученных знаний если не до конца , то на огромный процент!!! Надеюсь ты простишь новичка за некоторые исправления твоего видео))))
    1. Вместо switch теперь необходимо использовать Routes;
    2. useHistory убрали в router-dom v6 и заменили на useNavige, в котором по умолчанию исп-ся push
    3.exact не нужен теперь
    4. в route исп-ся теперь element c указанием компонента, вместо component
    5.у тебя в видео при рендере массива роутов идет component={route.component} ; у меня рендер массива роутов заработал только после указания в скобках element={}
    6.Redirect тоже убрали вместо него нужно исп-ть Route с переданным в element модуля ,
    пример с моего кода( ))
    Еще раз - автор не злись))) может кому-нибудь пригодится

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

      Спасибо! Ваш комментарий очень пригодился. Про Routes я нашёл на оф.сайте React Router, но вот про useHistory найти не смог.

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

      Спасибо!

    • @РоманКривощёков-б3щ
      @РоманКривощёков-б3щ 2 года назад +3

      5 пункт, меня изрядно помучал, долго не мог найти решения

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

      за 5-й пункт огромное спасибо, 2 часа искал ответ, а нашёл тут

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

      А с чего вы начинали изучать программирование?
      Можно с нуля начинать react сразу?

  • @learningit2572
    @learningit2572 2 года назад +720

    Досмотрел до конца , все повторил за тобой, еще много чего не понятно. Потратил так же около 30 часов. Огромная благодарность. Ты сделал большое дело. Сейчас у нас в Украине вакансий практически нет, но мы не унываем продолжаем учится и молимся что бы настал МИР! Ценю твой труд, очень при очень благодарен тебе

    • @igorekupaev1134
      @igorekupaev1134 2 года назад +114

      Все наладится, друг. Как минимум потому что всегда плохо быть не может. Я из России, все люди - люди:)

    • @tishkafocovv8723
      @tishkafocovv8723 2 года назад +75

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

    • @llssk6379
      @llssk6379 2 года назад +32

      вот это стойкость, красава!))) перед собой аж неудобно когда прочитал твой пост!

    • @TheMrDemage
      @TheMrDemage 2 года назад +26

      @@tishkafocovv8723 за что простите? за 8 лет войны 14к убитых людей на Донбасе?

    • @bambalbino
      @bambalbino 2 года назад +33

      @@TheMrDemage Ты думаешь, что это @Laerning IT их убивал?

  • @ЖеняЯворский-к6у
    @ЖеняЯворский-к6у 3 года назад +30

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

    • @UlbiTV
      @UlbiTV  3 года назад +11

      Как бальзам на душу такие слова:)

  • @Antony-d3l
    @Antony-d3l 4 месяца назад +5

    На мой взгляд это актуально даже в 2024, а такой подачи и полноты информации нигде больше не найти. Лучший канал с курсами.

  • @dr1m_o_o
    @dr1m_o_o Год назад +307

    Тем, кто делает сейчас. useHistory убрали, вместо него вы можете использовать useNavigate
    Было const router = useHistory()
    Стало const router = useNavigate()
    Далее, router.push('/path') меняем на router('/path')
    router.replace('/path') меняем на router('/path', {replace: true})
    Если вы хотите использовать state, используйте router('/path', { state: { name:'Xyz' }})

    • @saturnbeats8286
      @saturnbeats8286 Год назад +2

      Вы просто лучший! Спасибо большое

    • @igor-sukharev
      @igor-sukharev Год назад +4

      Также, теперь не нужно всегда импортировать React в файлы компонентов

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

      @@igor-sukharev импортировать теперь React только в App.js?

    • @illam-saiv
      @illam-saiv Год назад +1

      Вообще, со времени записи видео React Router обновился до v6, и там изменения очень серьёзные. Пропала обратная совместимость

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

      @@illam-saiv И многое из представленного в видео изменилось? Просто думаю проходить этот курс. Насколько он актуальный?

  • @co181
    @co181 Год назад +340

    Если кто-то собрался смотреть это видео с полного 0 не тратьте время!, для того чтобы получить максимальную пользу выполните следующее:
    1- поймите JS любым способом на хорошем уровне
    2- Пройдите любой курс по REACT (плохой/хороший долгий/быстрый не важно
    3- Приступайте к этому видео и после просмотра каждой темы останавливайте видео пытайтесь сделать сами, гуглите подглядывайте обратно в видео если не получается сделать и так весь курс до победного конца (займет это все примерно от 10 часов до 20)
    4- Поздравляю вы знаете и умеете в REACT
    Если начнете смотреть сразу с 0 без базовых знаний, вы просто не поймете на сколько крутой этот курс.
    Автору здоровья и большое спасибо! Прошел этот курс и наконец почувствовал уверенность в своих силах в REACT

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

      @Google Account freeCodeCamp, кайфуй.

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

      спасибо!

    • @questionsanswer6293
      @questionsanswer6293 Год назад +2

      Я думаю любому понятно что начинать нужно основ JS не совсем понял про курс React вы говорите про платные курсы? На них нет денег

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

      @@questionsanswer6293 любой который сможешь найти( на ютубе полно), пройди его тебе будет ничего непонятно но потом когда начнешь смотреть этот курс все встанет на свои места

    • @Andrey-Nechaev
      @Andrey-Nechaev Год назад +3

      И не забудьте к этим 10-20 часам прибавить время на освоение JS на хорошем уровне.

  • @Стасян-в5ы
    @Стасян-в5ы 2 года назад +114

    Ulbi, прими скромные слова благодарности. Получил мощнейшую информацию за этот ролик, делал все параллельно с тобой, ушло где-то 30-35 часов на всё. В какие-то моменты делал ошибки, искал решения, гуглил, думал уже, что это всё не для меня, но в итоге решал все и продолжал дальше. Огромное тебе спасибо за такую гигантскую помощь. Буду дальше продолжать работать с твоим каналом, это невероятный кладезь знаний

    • @UlbiTV
      @UlbiTV  2 года назад +18

      Спасибо за обратную связи и успехов тебе в обучении!

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

      Здравствуйте, разрешите понитересоваться, как ваши успехи в обучении?

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

      @@le0messiто что он тут показывает это 5 ти классник поймет, никакой глубины обычная тудушка

  • @sanchopansa8956
    @sanchopansa8956 Год назад +63

    Тимур, ты бесподобен!
    Честно признаться, твоё упорство в создании столь объёмного, качественного и разностороннего материала, причём бесплатного, вызывает восхищение!
    Продолжай в том же духе, ты очень сильно помогаешь! Твои курсы в сочетании с книгами и документацией дают безумно мощную базу.

    • @UlbiTV
      @UlbiTV  Год назад +6

      🙏🤝❤️

  • @nothingg1759
    @nothingg1759 3 года назад +64

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

    • @UlbiTV
      @UlbiTV  3 года назад +15

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

    • @ВладимирГугин-ш7щ
      @ВладимирГугин-ш7щ 3 года назад

      няяяяяяяяяяя

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

      Да видео достойное, до этого проходил не один курс, но и это уже вторая попытка освоить React. Подача материала оптимальная.

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

    Я сам дотнетчик, но посмотрел с удовольствием, автору респект! Видно очень много сил вложено, отлично все по полочкам, без воды, молодец!

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

      Спасибо!

  • @КорпорацияКрасногоДжокера

    Действительно лучший в своём роде урок! Мне 16, обучаюсь разработке сайтов и приложений, ваше видео это золотая монета сокрытая в интернете. Поверьте, я разбираюсь в контенте. Большое спасибо! Желаю вам попасть в рекомендации и получить хорошие деньги с рекламы чтобы была мотивация.

    • @КорпорацияКрасногоДжокера
      @КорпорацияКрасногоДжокера 3 года назад +1

      единственный минус, - на линуксе в списке библиотек нет "npx", все устанавливал самое новое. Видит только nyx, gpx, nex, npm.

    • @КорпорацияКрасногоДжокера
      @КорпорацияКрасногоДжокера 3 года назад

      На линуксе это отдельная библиотека:
      $ sudo npm -g install create-react-app

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

      Успехов дружище и спасибо за пожелания!

  • @ДмитрийМакаренко-б9р
    @ДмитрийМакаренко-б9р 8 месяцев назад +1

    Автор просто профи. Видео сделал грамотно и продуманно, в конце дал напутствие, как заниматься дальше, что мало кто делает. Спасибо.

  • @romanhudyma2164
    @romanhudyma2164 3 года назад +95

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

    • @UlbiTV
      @UlbiTV  3 года назад +78

      Так радует, что есть люди, которые могут оценить работу и поддержать, а не только потребляют :) спасибо!

    • @ВсадникАпокалипсиса-я9е
      @ВсадникАпокалипсиса-я9е 2 года назад +5

      @@UlbiTV ох очень зря ты проп назвал onChange точь-в-точь как и атрибут у select onChange, это вносит путаницу и новичку гораздо сложнее разобраться что к чему

  • @Sergey-lg1ke
    @Sergey-lg1ke 2 года назад +20

    за два вечера, повторяя все у себя и дополнительно экспериментируя, досмотрел пока только до 56:22, больше не могу ждать и пишу комментарий. Восторгу нет предела! Про чистоту подачи и плотность материала уже 100 раз сказали в комментах, присоединяюсь к каждому! Отдельное спасибо за то, как органично показана эволюция приложения. Новое вытекает из предыдущего именно в тот момент когда само просится а не просто накиданы какие-то абстрактные примеры.
    ОГРОМНОЕ СПАСИБО за материал, посылаю +500 к карме в этой и следующей жизни.

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

      Два вечера это сколько в часах? Какой темп на данный момент, если не секрет?

    • @Sergey-lg1ke
      @Sergey-lg1ke 2 года назад +4

      @@RedkeiGost уффф, местами по разному конечно, но в основном 10-15 минут видео == час реального времени на воспроизведение/осмысление + тесты/эксперименты. Где-то быстрее, где-то может и раза в два медленнее)) Темп видео такой, что кажется автор вырезал даже места где просто делает вдох))

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

      @@Sergey-lg1ke у него просто хорошая техника дыхания. На да, работа по обрезки лишнего большая и тчательная. У меня 35 часов примерно ушло, но я считал то, что шло по непрерывный комм там, т. е. Это не точно и плюс в конце перечитываю коммиты, обдумываю. Т. Е. Вроде время уже посчитано, но работа продолжается, хотя уже и лайтовая

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

      @@Sergey-lg1ke да, имейте ввиду, react-router-dom обновил апи и код из курса уже не работает. Не ищите ошибку у себя, сразу идите в доку и копируете оттуда. А концепт сам смотрите в курсе

    • @Sergey-lg1ke
      @Sergey-lg1ke 2 года назад +1

      @@RedkeiGost да, с ответами забавно получилось. Если актуально, нашел неплохой плейлист с обзором новой версии на канале Михаила Непомнящего

  • @АлександрРивалов-ы1н
    @АлександрРивалов-ы1н 2 года назад +152

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

  • @ГеоргийПилипюк
    @ГеоргийПилипюк 2 месяца назад

    Раз в полгода-год возвращаюсь к просмотру ролика - каждый раз помогает всё освежить и структурировать. Годнота!)

  • @ipa_stor
    @ipa_stor 3 года назад +51

    Наконец таки, теперь, когда меня будут доставать вопросами: "что ты там делаешь?" или "а как научиться?", буду просто кидать это видео😁😁😁 Тимур, спасибо, обязательно досмотрю, проверю свои знания:)
    Пс: 3 часа видео, нет слов, может прослушал, но ты хотя бы про донаты сказал? А то лайк и коммент услышал, а про донаты пропустил:)

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

      😂😂💪🏿💪🏿✊🏻✊🏻

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

    Спасибо! За неделю освоил данный курс. Всем советую, не пожалеете!

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

      Спасибо за фидбек)

  • @Александр-ц4т8в
    @Александр-ц4т8в 3 года назад +113

    Для себя
    Таймкоды:
    00:00 ➝ Введение
    03:15 ➝ Теория
    11:40 ➝ Начало разработки. Создание проекта
    16:10 ➝ Что такое JSX?
    18:11 ➝ Компонент App. Работа с состоянием. UseState
    22:25 ➝ Управляемый инпут
    24:07 ➝ Первый функциональный компонент
    26:40 ➝ Первый классовый компонент
    30:25 ➝ Что такое хуки? useState, useEffect
    31:10 ➝ Стили. CSS. Классы
    34:30 ➝ Props. Аргументы компонента.
    36:55 ➝ Работы со списками. Преобразование массива объектов в массив React элементов
    41:50 ➝ Форма создания поста. Управляемые и неуправляемые компоненты
    42:30 ➝ Создание UI библиотеки. Первые компоненты. CSS модули. Пропс children
    50:00 ➝ Предотвращаем обновление страницы при submit формы
    50:45 ➝ хук useRef. Доступ к DOM элементу. Неуправляемый компонент
    57:35 ➝ React Devtools. Инструменты разработчика React
    59:15 ➝ Обмен данными между компонентами. От родителя к ребенку. От ребенка к родителю.
    01:04:20 ➝ Отрисовка по условию
    01:05:30 ➝ Сортировка. Выпадающий список
    01:12:00 ➝ Поиск. Фильтрация.
    01:15:10 ➝ useMemo. Мемоизация. Кеширование
    01:23:50 ➝ Модальное окно. Переиспользуемый UI компонент
    01:30:23 ➝ Анимации. React transition group
    01:33:40 ➝ Декомпозиция. Кастомные хуки
    01:36:20 ➝ Работа с сервером. Axios
    01:38:40 ➝ Жизненный цикл компонента. useEffect
    01:43:08 ➝ API. PostService
    01:44:45 ➝ Индикация загрузки данных с сервера
    01:46:20 ➝ Компонент Loader. Анимации
    01:49:25 ➝ Кастомный хук useFetching(). Обработка ошибок
    01:54:15➝ Постраничный вывод. Пагинация (pagination)
    02:06:20 ➝ Обьяснение механизма изменения состояния
    02:12:00 ➝ React router. Постраничная навигация. BrowserRouter, Route, Switch, Redirect
    02:22:00 ➝ Динамическая навигация. useHistory, useParams
    02:29:30 ➝ Загрузка комментариев к посту
    02:33:10 ➝ Улучшаем навигацию. Приватные и публичные маршруты
    02:38:00 ➝ useContext. Глобальные данные. Авторизация пользователя
    02:47:10 ➝ Бесконечная лента. Динамическая пагинация. useObserver
    02:58:40 ➝ План на дальнейшее обучение. Ставим лайки и пишем комментарии :)

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

      так это и так в описании написано

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

      @@romanpolishchuk4517 ума понять, что автор видео скопировал данный комментарий и разместил его в описании видимо не хватило

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

      @@sdfdvfddfdfd9439

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

      ​@@sdfdvfddfdfd9439зачем хамить?

    • @abraham3345
      @abraham3345 Месяц назад

      @@olgadorosheva4424 чтоб точно понял)

  • @mariya-web
    @mariya-web 8 дней назад

    Тимур, огромное спасибо за этот курс! Видно, что ты проделал невероятную работу и объяснил сложные вещи простым и понятным языком. Особенно понравилось, что в курсе нет лишней воды: всё структурировано, только по делу, с реальными примерами, которые сразу применяются на практике.

  • @БегущаявТерновнике
    @БегущаявТерновнике 2 года назад +28

    "если ты досмотрел этот ролик до конца, ты молодец и у тебя всё получится!" тут я чуть не прослезилась) спасибо!

  • @selfishhsifles4536
    @selfishhsifles4536 3 года назад +239

    Для VScode rsc можно заменить расширением "ES7 React/Redux/GraphQL/React-Native snippets" и ввести вместо rsc "rafce"

  • @drunkmaster1101
    @drunkmaster1101 3 года назад +48

    Редко оставляю коментарии. Но тут не могу пройти мимо. Это, наверное, лучший ролик по теме реакта для начинающих во всем рунете. Большое тебе спасибо за такой труд. Тут я узнал больше, чем при чтении официальной документации.

  • @segavintovar92
    @segavintovar92 Месяц назад

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

  • @Eugene-j7h
    @Eugene-j7h 3 года назад +79

    Оставляю комментарий поддержки

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

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

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

      а что после этого видео изучал и где?
      подскажи пожалуйста

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

    Наверное один из ценнейших курсов, наряду с продвинутым React. Узнал как исправить те проблемы, которые встречались в моём проекте и как вообще всё это правильнее реализовать. Спасибо.

  • @Krystyna-y4y
    @Krystyna-y4y 4 месяца назад +1

    Просто супер, нет слов насколько это было полезно, понятно, последовательно, не скучно и интересно. Спасибо за твой труд!!! Это бесценно))) Это самое идеальное видео, которое я смотрела и слушала. Успехов тебе во всем!!!

    • @UlbiTV
      @UlbiTV  4 месяца назад

      Спасибо и взаимно!

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

    Это просто офигенно, наконец-то понял как работают все хуки и нашёл кучу ответов на свои вопросы, которые возникали на протяжении года работы!

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

    Очень полезный урок! Все четко и понятно. Таких уроков на ютубе ещё не видела, классная подача материала, без лишней воды. Спасибо!

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

      Спасибо вам!

  • @АлексейУрбанович-с9л
    @АлексейУрбанович-с9л 3 года назад +8

    Герой нашего времени! Присоединяюсь ко всем благодарностям и наилучшим пожеланиям! Продолжай в том же духе

  • @endfine9230
    @endfine9230 7 месяцев назад +4

    Какой же этот курс мощный, сегодня начал использовать всё что выучил на курсе и это прям вау, не представляю насколько тогда офигенен 'Продвинутый Frontend'

  • @zettt6
    @zettt6 3 года назад +20

    Сколько годной информации всего за 3 часа! Огромное спасибо автору, таким людям отдельное место в раю.

  • @MrNamed
    @MrNamed 3 года назад +110

    Вот же дела, курс совсем свежий, а докуменатция к React router уже изменилась :)
    Пришлось еще отдельно почитывать, как правильно роуты делать
    Если вдруг новички будут смотреть и тоже споткнутся, компонент теперь должен обязательно быть завернут в и имеет атрибут element.
    больше не используется, вместо него всё тот же . Ну и стандартный элемент в конце делается звездочкой.
    То бишь по итогу внутри у меня получилась такая конструкция:








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

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

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

    • @user-ds5jy3cj8o
      @user-ds5jy3cj8o 2 года назад

      Ну это как будто даже все упрощает. Спасибо

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

      Подскажи плиз, а как зафиксировать Navbar ??
      При переходе на другой роут у меня моя нав панель уходит. То есть она остается только на главной странице

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

      Спасибо мил человек! Если бы не твой комментарий, еще какое то время было бы убито впустую :)

    • @Валера-щ3р
      @Валера-щ3р 2 года назад +10

      Динамически тоже не сильно но меняется. Если кто не смог реализовать вот то как я написал.
      {
      routes.map((route) => {
      return ;
      })
      }

  • @СлаваПачевський
    @СлаваПачевський 3 года назад +18

    Структурированный, насыщенный с прекрасной подачей контент. Огромное спасибо!

  • @sentisie9013
    @sentisie9013 9 месяцев назад +8

    Курс, который по праву может называться фундаментальным. Такого четкого объяснения не видел нигде, да и в принципе, чтобы столько функционала затрагивали в одном видео. Большое спасибо за проделанную работу!

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

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

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

    Использование последних технологий, высокое качество кода ( у тебя сразу учишься как надо писать правильно, к этому приходишь только со временем, практикой и опытом), отличная качество видео, четкая и грамотная речь, все структурированное и понятно объясняется. В жизни не видел более полезно видео, да еще и в бесплатном доступе.
    Потратил около 40 часов, тк не тупо переписывал за тобой код, а смотрел отрывками по 5-10 мин и потом шел сам писать код, вылетали ошибки, что-то не работало, приходилось ковырять и много всего переписывать. Так же добавил добавил пару дополнительных фич и теперь очень уверенно себя чувствую в реакте. А самое главное, что после прохождение данного курса появилось еще больше желания и мотивации двигаться и развиваться дальше, пилить новые проекты и изучать новое!!!
    Огромное тебе спасибо за невероятный контент и всю огромную проделанную тобой работу!

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

      Отличный отзыв, большое спасибо!

  • @alexlei4232
    @alexlei4232 2 года назад +43

    react-router-dom Обновился до 6 версии. Читайте документацию!!! Если вкратце, появился компонент Routes внутрь него нужно вкладывать Route и в Route нельзя использовать вложенность Пример записи: ( )

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

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

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

      Спасибо помог.

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

      Спасибо. Я знал, что найду тут такой комментарий!

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

    Тут без перебільшення є все основне для вивчення React. Крім того відразу зрозуміло, що автор зробив величезний об'єм роботи! Щиро вдячний автору за цей курс!!

  • @matfeyivandaev5024
    @matfeyivandaev5024 3 года назад +10

    Как всегда, всё по делу, никакой воды. Спасибо за фундаментальный курс по React JS!

  • @ovircorp
    @ovircorp 3 года назад +70

    Я потратил неделю своей жизни для самостоятельного изучения реакта, и все мои знания накопленные за эту неделю уложились в первые 30 минут этого видео 😀😀 Прям выжимка информации, очень много вопросов у меня закрылись) Спасибо большое, практически каждое твоё видео - золото!) Крутым делом занимаешься, надеюсь твой твой пыл не угаснет и будешь дальше делать годный контент;) Пошёл смотреть другие твои видео

    • @UlbiTV
      @UlbiTV  3 года назад +10

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

    • @Meat-t7z
      @Meat-t7z 2 года назад

      @@UlbiTV Привет! Скажи, пожалуйста, каким образом параметр sort взял значение из массива options.
      Вот сам момент 1:10:13.

    • @Meat-t7z
      @Meat-t7z 2 года назад

      Ты скорее всего меня не понял, потому что я не могу сформулировать нормально)

    • @dieu-merci
      @dieu-merci 2 года назад

      @@Meat-t7z Array.prototype.map()

    • @Meat-t7z
      @Meat-t7z 2 года назад

      @@dieu-merci спасибо!!!!

  • @НикитаСысоев-и6е
    @НикитаСысоев-и6е 3 года назад +16

    Спасибо большое, 3 часа современного реакта без старого классового подхода, залатал пробелы в образовании. Никаких кошек и самолюбования на заднем плане - очень профессионально

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

      Спасибо!

  • @Zak_8
    @Zak_8 4 месяца назад

    спасибо за лучший курс на ютубе!
    Ролику уже 3 года, а ваш курс до сих пор советуют как лучший на ютубе!)

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

    Sorax, спасибо, что вернулся!))

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

      😂✊🏻

  • @adriansergeev2900
    @adriansergeev2900 3 года назад +131

    Спасибо за контент, у тебя здорово получается)
    Было бы огонь посмотреть про Unit testing React & Redux. Кто тоже так думает, лукас на коммент)

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

      ждем )

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

      да, несомненно, по тестированию вообще мало материала

  • @vitaliyyakovlev8376
    @vitaliyyakovlev8376 4 месяца назад

    Огромная благодарность автору! Настолько разжевать материал и вместить информацию в 3 часа, проделана колоссальная работа. Для старта в React - самое то!

  • @ВладКристал-ю9в
    @ВладКристал-ю9в 3 года назад +30

    Много работы вложено в этот выпуск. Спасибо вам большое

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

      И вам!

  • @gritsienkooleg3447
    @gritsienkooleg3447 2 года назад +65

    В 18 версии вместо React.render(...) надо писать
    import {createRoot} from "react-dom/client";
    const root = createRoot(document.getElementById('root'));
    root.render(
    ,
    );
    Другие изменения тоже погуглите, чтобы не страдать )
    Всем успехов!
    Тимуру спасибо за лучший контент!

    • @Logo-e2b
      @Logo-e2b 2 года назад

      Это не очень критично, реакт выдаст предупреждение, но отрисует

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

      @@Logo-e2b только что столкнулся с тем, что не отрисовывает. Терминал говорит о том есть предупреждение. Сделал как сказано в комментарии и сразу всё отрисовалось.

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

      спасибо! А я сначала подумал что я где-то ошибся. Но в офф документации прочитал ваше решение, а следом и здесь его увидел.

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

      У меня не рендерил , писал что функция рендер отсутсвует у ReactDOM. На оверфлоу нашёл решение описанное выше и реакт завёлся

    • @КурманкуловБелек
      @КурманкуловБелек 2 года назад

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

  • @slava1657
    @slava1657 2 года назад +26

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

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

      Спасибо! И вам успехов:)

  • @poltawckii152
    @poltawckii152 Месяц назад

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

  • @MrMenma26
    @MrMenma26 Год назад +12

    Это просто потрясающе. Большинство онлайн-школ за такой курс запросило бы приличные деньги и растягивало его на месяц. Вы сделали невероятную работу, спасибо.

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

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

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

      Спасибо за отзыв! успехов!

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

      @@UlbiTV В части "Работа со списками. Преобразование массива" у меня повляется ошибка TypeError: Cannot read properties of undefined (reading 'id'). Можете помочь пожалуйста что я не так сделал. Это ошибка появляется когда {posts.map(post =>

      )}
      перемещаю в файл PostList

  • @ЧеловексТопором
    @ЧеловексТопором 3 года назад +8

    Какой автор Красавчик! Мое уважение за столько подробный и качественный материал.

  • @paimonia
    @paimonia 10 месяцев назад

    Материал для видео очень удачно подобран и структурирован. А ещё этот канал - один из немногих обучающих, которые я не смотрю на скорости х2... идеальная скорость изложения и концентрация полезного, иногда даже паузу нужно поставить, чтобы осмыслить происходящее. Спасибо, с пользой и кайфом посмотрела ^__^

  • @sergeyschastlivtsev5643
    @sergeyschastlivtsev5643 3 года назад +10

    Мать моя женщина, как же ты крут! Спасибо)

  • @vados7341
    @vados7341 2 года назад +30

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

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

    Божечки, у меня не хватает слов благодарности, большущие спасибо, хотелось бы увидеть ролики/курс по JS

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

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

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

    Как же это шикарно, бро!!! Спасибо огромное! Я с первого видео с тобой вместе. Стану свидетелем твоего триумфа!

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

      Олды на месте)) спасибо бро!

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

    Это очень круто! Мощно, комплексно! Огромный труд!
    Думаю писать про обновление роутера бессмысленно, наверняка уже написали.
    Реакт хук хуки кастомные компоненты кастомные хуки пагинация бесконечная лента react router dom js javaScript useState useRef useEffect hook React fetch полный курс всё о подробно бесплатный курс просто понятно для интересно

  • @vasylp.4007
    @vasylp.4007 3 года назад +9

    Спасибо за возможность слушать качественный контент бесплатно

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

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

  • @ВсеволодКозлов-л2м
    @ВсеволодКозлов-л2м 3 года назад +4

    Тимур, спасибо огромное! Делал параллельно все как ты, периодически рисовал схемы, писал конспект, в коде писал комментарии. Так вот, хочу сказать, что благодаря тебе и тому, что внимательно, "от корки до корки" прошел этот видео-курс, у меня в голове очень многое улеглось. Ушло на все около 3-х рабочих дней) Премного благодарен!

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

      Каким образом ты схемы рисовал? Поделись опытом.

  • @МаксимКрутов-е8б
    @МаксимКрутов-е8б 3 года назад +19

    Приятно, слушать человека который знает о чём говорит и умеет доступно преподносить информацию!

  • @kseniapodoksenova188
    @kseniapodoksenova188 2 года назад +13

    Если ты досмотрел этот ролик до конца -- у тебя все получиться)) Прекрасная плотность информации, только по делу без всякой воды.

  • @MIkheyXD
    @MIkheyXD 9 месяцев назад

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

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

    Очень хороший курс. Действительно подойдет не только для новичков. Но очень перегружено.
    Ждем следующих роликов.

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

    Огонь!!! Это первый мой коммент на ютубе….

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

      И я рад что он под моим роликом:)

  • @wardxela
    @wardxela 3 года назад +20

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

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

      Спасибо!

  • @johngurevich9959
    @johngurevich9959 Год назад +19

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

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

    2 недели делал и смотрел 3 часа. Для начинающих самое то. Спасибо.

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

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

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

      @@liza2141 -

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

      @@bifacial605 что это значит?

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

      @@liza2141 отрицание

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

    Огромное спасибо за материал! Все успешно проработал, усвоил. Была пара проблемных мест (основная в части о useFetching), но благодаря исходникам на GitHub разобрался. Еще раз спасибо! Концентрация информации на высоте! )))

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

      Спасибо! Успехов!

  • @РитаСуворова-л4ж
    @РитаСуворова-л4ж 2 года назад +7

    Никогда не смотрела обучение с таким интересом, как просто развлекательный видос! Очень хорошо и понятно излагаешь материал, спасибо 👍🏻

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

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

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

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

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

    Уважаемый, дорогой Тимур, спасибо Вам за столь колоссальный труд. И отдельное спасибо, за умение подать материал. Вас очень приятно слушать.

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

    Только начинаю учить React, и, кажись, благодаря тебе, буду учить его с кайфом)
    Огромное спасибо за такой бесценный контент!

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

      Успехов!

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

      @@UlbiTV Спасибо! :)

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

      @@Coldarinn Ну как?

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

      @@ilya_fimin Отлично, работаю)

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

    Отличный курс, без воды, в каждой минуте полезная информация - эти 3 часа ощущаются раз в 10 дольше. Так же не стоит изучать совсем новичкам как самый первый курс React, при практике очень легко застопориться из-за мелких ошибок или непонимания сути ошибок в логах. Выдохнула с облегчением наконец завершив рабочее приложение.

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

    Понятно и без воды, React, Frontend, полный курс. Спасибо, это очень круто!)

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

      ✊🏻✊🏻

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

      @@UlbiTV видео классное, спасибо. Для практики вот с этими знаниями из курса, чтобы закрепить какой твой проект подойдет? Магазин там, или Спотифай.
      Просто сразу лететь дальше в TS или Redux не закрепив это на каком-то проекте наверно не стоит?

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

      Интернет магазин) можно пропустить бекендовскую часть если интересен только реакт

  • @oleksii.shkulipa
    @oleksii.shkulipa 3 года назад +64

    когда знаешь что следующее 3и часа пройдут продуктивно 👍
    Спасибо

  • @ГерманМиллер-ш8р
    @ГерманМиллер-ш8р 3 года назад +19

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

  • @PieceOfInternet
    @PieceOfInternet 11 месяцев назад

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

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

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

  • @АнтонИшинкин-п7о
    @АнтонИшинкин-п7о 3 года назад +4

    Большое спасибо за видео! Когда-то получал большое удовольствие от подкастов и уроков Соракса, наконец-то нашёл что-то похожее.

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

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

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

    Спасибо огромное! Шикарнейшая практика! А особенное спасибо что нет каждые 10 секунд переключения между файлами когда глаза устают от вечного мельтешения и ерзанья мышью!!!

  • @ВладимирЗубков-ф9р
    @ВладимирЗубков-ф9р 3 года назад +4

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

  • @ЄвгенАлімов
    @ЄвгенАлімов 3 года назад +11

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

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

    Несправедливо маленькое число подписчиков и просмотров у такого прекрасного автора

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

      Растем потихоньку! Спасибо!

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

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

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

    Готовлюсь к собеседованиям, решил пересмотреть, чтобы освежить память. Спасибо за этот курс ! 🚀Full React Course , React JS фундаментальный курс от А до Я

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

      Как собесы?

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

      @@astkh4381 уже прошёл несколько технических и тестов с CodingGame.
      Ну большинство рекрутеров говорят,что типа опыта нет в кампаниях, поэтому вашу кандидатуру не можем продвигать😂 другие сказали,что тесты сдал , но вакансий пока нет.
      Это я пока отправлял заявки не в какую-то конкретную компанию а в агенства, которые ищут девелоперов, чтобы в фирмы устроить.
      Прошёл один тест в компанию, сказали, что мой код слишком junior для них, без каких то объяснений 🤷🏻‍♂️ я попросил CTO, чтобы мне хотяб сказали , что им не понравилось, но ответа не было 🤷🏻‍♂️
      Сейчас я решил сделать маленькую паузу, подтянуть пробелы, и через пару недель снова вперед 🚀 в этот раз буду уже заявки отправлять в конкретные компании, там и посмотрим чего мои знания стоят 😂🚀#neverGiveUp

  • @MrEmil-cf8wo
    @MrEmil-cf8wo 2 года назад +15

    Спустя 3 дня маленькими шагами досмотрел этот курс, скажу честно, если бы я до армии что то не писал на реакте то этот курс мне бы очень тяжело дался + ты все очень быстро делаешь) но как ты сказал с 1 раза врятли кто то освоит. Так что спасибо за твой труд, буду стараться применять твои знания в дальнейшем!

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

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

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

    Благодарю за видео урок. Ждем для продвинутых разработчиков. и Реакт и Вью

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

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

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

    Коментарий в качестве благодарности, видео просто бомба, особенно про react-router

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

      Спасибо:)