Впервые за три года изучения нашел видео ролик, в котором все подробно и понятно описано. С помощью вашего видео я понял что такое React. Надеюсь в будущем увидеть еще ваши видео по React разработки!
Так...В целом видео очень хорошее и дает представление новичку как можно перейти на реакт. Главное повторять за автором шаг за шагом и внимательно слушать что он говорит. Ну, а если такой подход к разработке зайдет, то можно и глубже в реакт погружаться. Если несколько советов из личного опыта касательно этого видео: - не используйте CRA, В рамках одного видео, для понимания, да, можно. Если погружаться дальше в разработку, то используйте Vite(к примеру). CRA больше не поддерживается, у него нет обновлений, а значит и могут быть проблему с установкой новых модулей и уязвимостью. - импортирование функции работает и когда файл с ней закрыт. Главное чтобы экспорт был прописан, а откуда ее взять vscode сам знает. К тому же не обязательно перед использованием фукнции или хука, его импортировать руками. Можно просто начать писать useState к примеру и после введения use, IDE уже сама вам начнет предлагать варианты импорта - это называется реакт фрагмент и если говорить простым языком, то он дает понять компилятору реакта, что разметка которую вы в него помещаете, будет являться частью какого-то другого блока. Это очень удобно при разработке универсальных компонентов или частей интерфейса - browserRouter лучше использовать в корневом файле, т.е main.js. Если у вас в приложении будет несколько Routes, то не придется browserRouter прописывать для каждого. К примеру эту ситуация может возникнуть когда у вас есть шапка, навигационное меню в личном кабинете или на выдаче товаров. Нужно стараться избегать дублирования кода....ну а если как в примере, то можно и так как показано делать. В документации кстати указаны оба варианта, значит можно - для реакта лучше использовать css модули, они позволяют более гибко жонглировать стилями и не создавать лишних переменных, но это опять же...ситуативно.
Решил просто посмотреть как пишут на React и вдруг осознал как лучше писать на Blazor. Благодарствую. Кстати урок интересный мне понравился и как абсолютно не знающему React был понятен.
Спасибо!Крутой видос!Это мой первый опыт с React!Но мне уже нравиться!Благодаря таким видео желание продолжать учиться не пропадает а наоборот растет!Спасибо большое!Очень хотелось бы увидеть у вас курс по React!Ещё раз огромное спасибо за то что обучаете людей!
Юра, спасибо огромное! Классно обьясняешь..давайте еще что-то по реакту на часов 5-6) по-жа-луй-ста) сам же видишь такого рода видосы популярны...как например JS за 6 часов..такие видосы помогут раскрутке канала..
офигенный урок по Реакту, впервые все так прозрачно и понятно) Спасибо огромное, теперь бы еще получать данные из бд, а не переменной будет вообще пожар)
Редко такое, чтобы я по своей воле писал комментарий, да еще и положительный. Тот случай когда неудержаться) С первых минут поставил лойз и далее не был разочарован. Посмотрел полностью как фильм) Первое знакомство и с React и с каналом ВебКадеми. Супер подача для чайников, все понятно. Надеюсь в будущем будет больше ваших туториалов с таким внятным донесением информации 👍🏼
Маестро благодарю! Классно объясняешь..давайте еще что-то по REACT на часов 5-6 please сам же видишь такого рода уроки популярны...как например JS за 6 часов..такие уроки помогут раскрутке канала..
Замечательные уроки, курсы, прям вот получаю удовольствие от разработки. Единственно хотелось бы попросить, ну будущее при монтаже видео уменьшать звук включения заставки ВебАкадеми на оранжевом фоне. Когда смотришь в наушниках это прям врезается на фоне голоса Юры. Пожалейте слух своих подписчиков =)
Видео годное. По поводу файловой структуры - имхо можно было бы использовать модульный css в файлах компонентов, чтобы компонент был независимым и никакой другой разработчик случайно не переопределил стили этого компонента и не сломал дизайн. Но эти решения для больших проектов, где пилят несколько девелоперов. Все дело в уникальности названий классов, потому что правила для класса с тем же именем, следующие ниже в общем css, переопределят верхние правила - и все поломается.
Как человек, который играл на концертах в барах, могу сказать: 6:01 - у нас есть специальные наушники потому что ты ходишь по концерту и можешь плохо слышать себя,они заглушают всё, и ты слышишь только себя. Они работают как затычки фактически. Что касается того, что он был не заинтересован в скорой помощи - да, это уже пофигизм. Про поднятие охраны: возможно, человека уже спасали, и поэтому он начал говорить «еее» одновременно как часть шоу и как подтверждение, типа «молодцы». Насчёт бита: на большинстве концертов всегда играют минусовку или какую-то песню, чтобы людям не было скучно. (Не за все говорю)
Очень крутой контент для новичка!!! Еще было бы интересно как реализовать на реакт модальные окна (с разными вариантами: вызов формы связи, открытие картинок в отдельной модалке, и модалка в нутри модалки), так же интересно было бы посмотреть реализацию форм связи, и третья идея для урока это добавление стилей через "modul" (думаю поняли о чем я...... когда реакт автоматом генерирует уникальные стили). Спасибо за видео!!!
Юрий, спасибо за годный контент) Из пожеланий хотелось бы, чтобы в проекты на React вы добавляли и typescript. Так как без typescript сейчас в работе никуда. Он везде требуется.
Спасибо огромное за такой урок! Очень полезные и приятные видео) Сейчас много изменений из-за новой версии React Router DOM(v6) так что вот еще один из вариантов реализовать прокрутку при переходе на другую страницу import { useEffect } from "react"; import { useLocation } from "react-router-dom"; export default function ScrollToTop() { const { pathname } = useLocation(); useEffect(() => { // "document.documentElement.scrollTo" is the magic for React Router Dom v6 document.documentElement.scrollTo({ top: 0, left: 0, behavior: "instant", // Optional if you want to skip the scrolling animation }); }, [pathname]); return null; }
Спасибо за ваши уроки, они прекрасны и по содержанию, и по подаче! По данному уроку возник вопрос, будет ли работать трюк с local storage на мобильных устройствах? И вообще возможно ли реализовать подстройку под системную тему пользователя без local storage?
@@dina8700 Спасибо) На мобилках работать будет. local storage здесь нужен только чтобы запомнить выбор пользователя. Можно и без него обойтись и по умолчанию включать системную тему.
Спс за урок! Думал что все же сделаешь в конце кнопку загрузки файла CV (хотя уже сам сделал, минутное дело оказалось). P/S А я вот все никак не мог привыкнуть к твоему стилю некотрых названий, я про повторяющийся project.js и style.css Ну то такое поменял под себя чтобы не путаться.
@@maryouchie ток увидел, да там же просто линк на тег a повесить нужно! Я cv разместил на гугл диске и вписал линк уже на версию загрузки(как такой делается можно нагуглить)
Большое спасибо! Почему у вас нету доступа к вашим платным курсам из Кыргызстана? На анкете в вашем сайте не могу указать номер Кыргызстана. Хотел бы купить у вас полноценный курс по фронтэнд.
если установить create-react-app глобально, то пакеты будут той версии, которую мы установили при create-react-app и через некоторое время при запуске create-react-app у нас будут не свежие пакеты а те что когда то мы сохранили глобально ?
Юрий подскажите пожалуйста по переносу строку кода, у вас код к примеру тэги li идут в одну строку, а у меня форматирует их с переносом, я пытался настраивать претьер на большую ширину строки но это не сработало. Как сделать чтобы не было лишних переносов ?
Привет,а как можно ли объединить ключи в объектах(есть 5 вариантов ответов на вопрос,человек нажимает на любой из них и каждый ключ увеличивает свое значение на 1)(есть допустим ключи a,b,c,d,e и вот человек нажал на любой ответ и счетчик во всех ключах перешел от 0 до 1)?
При команде npm start, во время открытия приложения, терминал выдает npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Кто может подсказать, как решить вопрос?
![React JS c Нуля - Курс для начинающих БЕЗ ВОДЫ [2024]](http://i.ytimg.com/vi/kz23xxukY5s/mqdefault.jpg)
Впервые за три года изучения нашел видео ролик, в котором все подробно и понятно описано. С помощью вашего видео я понял что такое React. Надеюсь в будущем увидеть еще ваши видео по React разработки!
Так...В целом видео очень хорошее и дает представление новичку как можно перейти на реакт. Главное повторять за автором шаг за шагом и внимательно слушать что он говорит. Ну, а если такой подход к разработке зайдет, то можно и глубже в реакт погружаться. Если несколько советов из личного опыта касательно этого видео:
- не используйте CRA, В рамках одного видео, для понимания, да, можно. Если погружаться дальше в разработку, то используйте Vite(к примеру). CRA больше не поддерживается, у него нет обновлений, а значит и могут быть проблему с установкой новых модулей и уязвимостью.
- импортирование функции работает и когда файл с ней закрыт. Главное чтобы экспорт был прописан, а откуда ее взять vscode сам знает. К тому же не обязательно перед использованием фукнции или хука, его импортировать руками. Можно просто начать писать useState к примеру и после введения use, IDE уже сама вам начнет предлагать варианты импорта
- это называется реакт фрагмент и если говорить простым языком, то он дает понять компилятору реакта, что разметка которую вы в него помещаете, будет являться частью какого-то другого блока. Это очень удобно при разработке универсальных компонентов или частей интерфейса
- browserRouter лучше использовать в корневом файле, т.е main.js. Если у вас в приложении будет несколько Routes, то не придется browserRouter прописывать для каждого. К примеру эту ситуация может возникнуть когда у вас есть шапка, навигационное меню в личном кабинете или на выдаче товаров. Нужно стараться избегать дублирования кода....ну а если как в примере, то можно и так как показано делать. В документации кстати указаны оба варианта, значит можно
- для реакта лучше использовать css модули, они позволяют более гибко жонглировать стилями и не создавать лишних переменных, но это опять же...ситуативно.
Спасибо за информацию. Приятно видеть такие советы когда ты новичок
Юрий, вы человечище! Спасибо большое все понятно и красиво, один из лучших контентов в ютубе на тему фронта)
Спасибо, осталось добавить тайм коды и будет вообще 🔥
Спасибо, это видео буквально спасло меня от депрессии)) когда я застопорилась на некоторых моментах.
Решил просто посмотреть как пишут на React и вдруг осознал как лучше писать на Blazor. Благодарствую. Кстати урок интересный мне понравился и как абсолютно не знающему React был понятен.
Очень полезный урок по Реакту. Грамотно и понятно все показано и рассказано. Спасибо!
Юрий смотрю ваши уроки давно, объясняете очень хорошо. Практика на высоте, спасибо мастер Шифу!
Нельзя такое видео оставить без комментария. Спасибо огромное за такой подробный урок.
Спасибо!Крутой видос!Это мой первый опыт с React!Но мне уже нравиться!Благодаря таким видео желание продолжать учиться не пропадает а наоборот растет!Спасибо большое!Очень хотелось бы увидеть у вас курс по React!Ещё раз огромное спасибо за то что обучаете людей!
Спасибо за комментарий!) Да, надо подумать над мини курсом по React на канал.
После этого урока, я понял, как важно иметь порядок в файлах со стилями)
Жесть конечно, вы просто невероятный человек, спасибо вам большое ! На одном дыхании повторил весь урок. Вы познакомили меня с реактом с нуля)
Юрий вообще МОЛОДЕЦ!!! Учу React по его урокам. Все доходчиво. Спасибо огромное!!!
Юра, спасибо огромное! Классно обьясняешь..давайте еще что-то по реакту на часов 5-6) по-жа-луй-ста) сам же видишь такого рода видосы популярны...как например JS за 6 часов..такие видосы помогут раскрутке канала..
Самый лучший канал на русском ютубе по таким роликам,очень хорошо объясняете,спасибо большое
Большое спасибо! Благодаря вам перенес на реакт свой сайт портфолио и дополнил его функциональность!
У Вас случайно данного макета из видео не осталось?
Спасибо вам за этот урок теперь я понял как нужно переносить вёрстку и работать с ней в react.
Юрий, спасибо, очень полезный урок для начинающих изучать React!
Спасибо вам огромное!
Мне понравилось как вы объясняете. Чоң рахмат!
Руки еще не дошли до react, видео очень клёвое. Суть одна это веб компоненты)
О, круто. Давно хотел изучить React. Жги, Юра!
офигенный урок по Реакту, впервые все так прозрачно и понятно) Спасибо огромное, теперь бы еще получать данные из бд, а не переменной будет вообще пожар)
Юрий , выражаю Вам огромную благодарность 😁
Редко такое, чтобы я по своей воле писал комментарий, да еще и положительный. Тот случай когда неудержаться) С первых минут поставил лойз и далее не был разочарован. Посмотрел полностью как фильм) Первое знакомство и с React и с каналом ВебКадеми. Супер подача для чайников, все понятно. Надеюсь в будущем будет больше ваших туториалов с таким внятным донесением информации 👍🏼
классный подход и подача материала + готовый проект для разбора. спасибо!!
Пушка-гонка, Юрий! Давай вот такого побольше и почаще! Погнали заделаем сервис по билетам, отелям, бронированию машин на React+Redux+TS будет бомба!
Спасибо большое! Очень рад, что просмотрел этот урок!
Лучший, объясняй так по подробнее дальше
React router dom очень хорошее объяснение. 👍
Спасибо! Почти всё понял несмотря на то, что не смотрел предыдущий урок)
Очень классный урок, все очень понятно, вы ооооооочень круто объясняете, спасибо вам, продллжайте снимать React.
Спасибо! это первое видео по которому я изучаю React! Именно его мне посоветовали для старта! 🤘
Я предпочитаю картинки держать в public , чтобы не было столько заморочек с их импортами. А так респект👍
Юра, спасибо огромное! Классно обьясняешь..давайте еще что-то по реакту на часов 5-6).Отличный урок хотя бы смог запустить и многое понять!
Спасибо! Надеюсь ролик не удалите, т.к. планирую к нему обращаться еще не раз ))
Ролик будет на канале 👍
только с твоими уроками я начал понимать JS , лучший!!!
Благодарочка от души за такую понятную подачу материала!👍👍👍 Я после платных курсов по фронтенд, наконец-то доделал резюме, вспомнил реакт😄🤝
Маестро благодарю! Классно объясняешь..давайте еще что-то по REACT на часов 5-6 please сам же видишь такого рода уроки популярны...как например JS за 6 часов..такие уроки помогут раскрутке канала..
Спасибо! Полезный урок! Просьба сделать урок по Next.js
спасибо большое, много полезной инфы, которая пригодится в будущем
Юрий, спасибо Вам огромное за такой контент!!! Для новичков как раз то что нужно!!!!
Єдине відео, де все чітко зрозуміло.
Спасибо большое за ваш труд, безумно полезно. Вы супер пупер)
Отличное обьяснение для новичка, автору спасибо!
Замечательные уроки, курсы, прям вот получаю удовольствие от разработки. Единственно хотелось бы попросить, ну будущее при монтаже видео уменьшать звук включения заставки ВебАкадеми на оранжевом фоне. Когда смотришь в наушниках это прям врезается на фоне голоса Юры. Пожалейте слух своих подписчиков =)
Спасибо, приму к сведению.
Видео годное. По поводу файловой структуры - имхо можно было бы использовать модульный css в файлах компонентов, чтобы компонент был независимым и никакой другой разработчик случайно не переопределил стили этого компонента и не сломал дизайн. Но эти решения для больших проектов, где пилят несколько девелоперов.
Все дело в уникальности названий классов, потому что правила для класса с тем же именем, следующие ниже в общем css, переопределят верхние правила - и все поломается.
Спасибо Огромное за такой Видеоурок, нашел ответы на многие свои вопросы 👍👍👍
Просто и доходчиво. Так и надо! Лайк
очень ценный урок, спасибо тебе бро
Отличный видеоурок спасибо огромное!
Спасибо огромное за урок! Всё очень понятно и доступно для новичка.
Спасибо за урок. Как всегда, все максимально понятно!
Смотрю ваши уроки с удовольствием, объясняете очень хорошо. Огромное спасибо! (Ссылка на сайт школы битая ....)
Супер!!! Все доступно и понятно , спасибо!!!
Спасибо большое за ролик 👍👍👍, было бы круто если показали как работает реакт с бэкендом
Как человек, который играл на концертах в барах, могу сказать:
6:01 - у нас есть специальные наушники потому что ты ходишь по концерту и можешь плохо слышать себя,они заглушают всё, и ты слышишь только себя. Они работают как затычки фактически.
Что касается того, что он был не заинтересован в скорой помощи - да, это уже пофигизм.
Про поднятие охраны: возможно, человека уже спасали, и поэтому он начал говорить «еее» одновременно как часть шоу и как подтверждение, типа «молодцы».
Насчёт бита: на большинстве концертов всегда играют минусовку или какую-то песню, чтобы людям не было скучно. (Не за все говорю)
Спасибо за комментарий. Думаю вы писали его к другому ролику.
Очень крутой контент для новичка!!! Еще было бы интересно как реализовать на реакт модальные окна (с разными вариантами: вызов формы связи, открытие картинок в отдельной модалке, и модалка в нутри модалки), так же интересно было бы посмотреть реализацию форм связи, и третья идея для урока это добавление стилей через "modul" (думаю поняли о чем я...... когда реакт автоматом генерирует уникальные стили). Спасибо за видео!!!
Думается написать свое можно)
Юрий, спасибо за годный контент) Из пожеланий хотелось бы, чтобы в проекты на React вы добавляли и typescript. Так как без typescript сейчас в работе никуда. Он везде требуется.
Должно быть пушка, щас заценим 👍
Новый уровень. Поздравляю!
Спасибо за видео! Так классно объясняете! Все понятно!
Thank you very much. GREAT JOB!
Жаль что я не к вам в школу пошел)уже бы выучил и разобрал все)
Жаль) Приходите к нам.
Спасибо огромное за такой урок! Очень полезные и приятные видео) Сейчас много изменений из-за новой версии React Router DOM(v6) так что вот еще один из вариантов реализовать прокрутку при переходе на другую страницу
import { useEffect } from "react";
import { useLocation } from "react-router-dom";
export default function ScrollToTop() {
const { pathname } = useLocation();
useEffect(() => {
// "document.documentElement.scrollTo" is the magic for React Router Dom v6
document.documentElement.scrollTo({
top: 0,
left: 0,
behavior: "instant", // Optional if you want to skip the scrolling animation
});
}, [pathname]);
return null;
}
Дякую
Круто. Опробовал. Работает =)
Спасибо за ваши уроки, они прекрасны и по содержанию, и по подаче! По данному уроку возник вопрос, будет ли работать трюк с local storage на мобильных устройствах? И вообще возможно ли реализовать подстройку под системную тему пользователя без local storage?
@@dina8700 Спасибо) На мобилках работать будет. local storage здесь нужен только чтобы запомнить выбор пользователя. Можно и без него обойтись и по умолчанию включать системную тему.
Cпасибо, Юрий! Крутой контент!
Спасибо Вам большое! Огромный труд!
Спасибо, грамотно и понятно!
30 лет назад придумали инсталяторы и батники .
Но до сих пор юзаем командную строку полчаса для установки программ:)
Спасибо, хороший урок.
Спасибо большое за полезный урок 💕
спасибо Юрий за урок!)
Спасибо! Было интересно!)))
Спасибо! Кстати, на винде видео были гораздо плавнее и смотрибельнее)
Не сразу заметил. Но недавно заморочился по этому поводу. Это настройки качества записи. Сейчас подкрутил, чтобы цвета были поярче. В новых исправлю.
ну ты малчик гигант
Спасбо за урок
Благодарен вам за ваш труд
спасибо за уроки 😉
Спс за урок! Думал что все же сделаешь в конце кнопку загрузки файла CV (хотя уже сам сделал, минутное дело оказалось).
P/S
А я вот все никак не мог привыкнуть к твоему стилю некотрых названий, я про повторяющийся project.js и style.css
Ну то такое поменял под себя чтобы не путаться.
Подскажите, как вы сделали кнопку загрузки СV? Как раз пытаюсь сделать ее и никак не получается :(
У кого-то получилось? А то я тоже не могу разобраться
@@maryouchie ток увидел, да там же просто линк на тег a повесить нужно! Я cv разместил на гугл диске и вписал линк уже на версию загрузки(как такой делается можно нагуглить)
@@luchi_m ответил комментом выше
оооо! вот это - то что нужно!!!
Спасибо за урок! Какая у вас тема в vscode?
Ayu
Спасибо за контент!
Круто!!! Спасибо!!!
Спасибо Огромное!!Класс
Thanks you, very good content!
Отличный урок
Пушка-бомба
Кто-нибудь может подсказать как присваивается isActive? Что-то не получается разобраться
Подскажите, пожалуйста, название темы в VSC.
привет ) а Вы не праниуете создать прект на redux , RTK ?
спасибо большое
Спасибо!
Юрий, огромное спасибо за работу! такой вопрос: светлая и темная темы не работают на странице Хоум. Где искать ошибку?
Ошибся, все работает, сорри)
@@aleksandrprokudin4715 Уже хотел, что надо смотреть в консоли, есть ли ошибки там. Но вы уже написали что все в порядке. 👍
Большое спасибо! Почему у вас нету доступа к вашим платным курсам из Кыргызстана? На анкете в вашем сайте не могу указать номер Кыргызстана. Хотел бы купить у вас полноценный курс по фронтэнд.
держи комент брат
Азан на заднем фоне? Где дислоцируешься?)
если установить create-react-app глобально, то пакеты будут той версии, которую мы установили при create-react-app
и через некоторое время при запуске create-react-app у нас будут не свежие пакеты а те что когда то мы сохранили глобально ?
Обьясните пожалуйста как работает isActive на смене классов при переходе по другим ссылкам, это встроенный метод у React или что?
Юрий подскажите пожалуйста по переносу строку кода, у вас код к примеру тэги li идут в одну строку, а у меня форматирует их с переносом, я пытался настраивать претьер на большую ширину строки но это не сработало. Как сделать чтобы не было лишних переносов ?
Привет,а как можно ли объединить ключи в объектах(есть 5 вариантов ответов на вопрос,человек нажимает на любой из них и каждый ключ увеличивает свое значение на 1)(есть допустим ключи a,b,c,d,e и вот человек нажал на любой ответ и счетчик во всех ключах перешел от 0 до 1)?
Привет Юрий скажи пожалуйста может ли искусственный интеллект заменить веб-разработчика?
Ага скайнет программа называется)
@@131ZIL ты серьёзно?
На текущий момент нет. Пока таких решений нет. И не предвидится, тем более если говорить о корпоративной IT разработке.
@@WebCademy Хорошо спасибо
При команде npm start, во время открытия приложения, терминал выдает npm : The term 'npm' is not recognized as the name of a cmdlet, function, script file, or operable program. Кто может подсказать, как решить вопрос?
А node JS установлен? Попробуйте после его установки перезапустить систему. Работаете от аккаунта админа или с ограниченными правами?
Посмотрите первый ответ stackoverflow.com/questions/20992723/npm-is-not-recognized-as-internal-or-external-command-operable-program-or-bat