React для НОВИЧКОВ [2023]: первый проект на React JS | Как запустить приложение на React?
HTML-код
- Опубликовано: 14 июн 2024
- - Что такое React JS?
- Для чего он нужен?
- С чего начать изучение?
- Как запустить свой первый проект на React?
Всё это вы узнаете, досмотрев ролик до конца. В нём я познакомлю Вас с Реакт с нуля и научу работать с этой библиотекой.
Приятного просмотра! 🔥
➡️ ROADMAP с НУЛЯ до MIDDLE: • Что должен знать JUNIO...
* ТАЙМ-КОДЫ:
00:00 Что вы узнаете
00:27 Что такое React JS?
00:44 Преимущества React
01:41 Что такое Виртуальный DOM
02:41 Как создать проект на React
04:30 Что такое create-react-app
06:34 Обзор шаблона CRA
09:51 Запуск проекта на React
13:20 Что такое JSX
13:56 Подготовка проекта к разработке
15:50 Создание React компонентов
18:17 Что такое React Fragment
20:00 Отображение повторяющихся элементов
21:45 map vs forEach в JS
24:13 Ошибка key в map
25:21 Заключение
* СОЦ. СЕТИ:
👀 Instagram - / pomazkov.js
🚀 Telegram - t.me/pomazkovjs
* ОБО МНЕ:
Меня зовут Арсений Помазков, я - senior frontend-разработчик, начавший карьеру на американской фрилансе-бирже и прошедший путь от «стажёра» до «старшего разработчика».
Я обучился программированию самостоятельно, и моя цель - показать вам, что веб-разработка - это не только перспективно и востребовано, но и очень увлекательно 🔥
#фронтенд #реакт #reactjs #javascript
![React для Новичков [2024] | с чего начать изучение React?](http://i.ytimg.com/vi/CGJp7PMBF1I/mqdefault.jpg)
![React для Новичков [2024] | с чего начать изучение React?](/img/tr.png)
Супер доступное и понятно объяснение! Спасибо за проделанную работу!
Очень жду продолжение видео по React
Про Vite было бы очень интересно послушать!
Спасибо за видео =)
Очень полезно, лайкосик) Я дошел до реакта, ура)
Хотим больше про реакт!) Проэкт первый создали, надо же и дальше что то делать)
Спасибо большое! Лучшее объяснение что я видел и слушал. Просто Браво! Вы большой молодец что создаете качественный и полезный контент!
Спасибо огромное за видео, всё четко и не занудно, у меня наконец получилось сделать всё правильно 👍 с радостью продолжу смотреть все видео и тренироваться больше и больше!
Отличное видео для быстрого старта. Приятный на слух голос и простая подача 👍
Долго мучался - сздание проекта по другому старому видео, сдесь все получилось. Подписка.
Отличное видео! Пожалуйста продолжайте! Все четко, ничего лишнего и реально проснулась )))
Как все последовательно, доходчиво! Просто восторг! Спасибо) Лучшее изложение информации!
На канале вчера вышла обновленная версия этого видео - расширенная, с более современным инструментов. Советую посмотреть по горячим следам, будет видна разница как раз)
Арсений, спасибо за видео. Очень круто и понятно объясняешь, очень приятно слушать! Ждём продолжения!
Для старта как мне показалось отличное видео) Спасибо)
Круто объясняешь! Хоть я и проходил уже эти темы, повторение не навредит. Очень наглядно показал про CRA 👍
бро, подписался на канал! все по делу, ждем след уроков
Все по полочкам объяснил спасибо. Не так как не которые воду льют , а сразу к делу вот это я поддерживаю! Спасибо тебе!
Базара нет! От души родной как понятно и четко объяснил ❤
Крутой видеоролик, жду ещё по React думаю очень скоро будет видео по React🔥🔥🔥
Спасибо за видео, подробно и содержательно!
Лучше видео по введению в реакт в мире. Спасибо! Нужно больше видео о реакт)
Спасибо за урок очень помогает новичкам.
Это самое толковое объяснение которое я смогла найти на русскоязычном YT за последние 3 дня поисков)) Спасибо и удачи тебе в развитии канала.
Я посмотрел 4 или 5 видео по типу "Реакт для новичков" и только с твоего объяснения понял, спасибо тебе большое!
Воу, огонь! Очень рад слышать) Спасибо!
Спасибо❤ Ждем еще видео по ReactJs-как принимать и отправлять данные из/в beckend
Спасибо за понятное объяснение 🙏
Спасибо! все понятно!
Спасибо, очень доходчиво!
Спасибо! Крутой обзор!
Дякую. Гарний відос для нульового старту реакт 🤙
спасибо!
жду еще про реакт!
зашел чисто лайк поставить)
а посмотрю попозже 8-)
Очень интересный контент делаешь, продолжай в том же духе !
Чувак, ты лучший!
Мой интенсив по JS:
🔥pomazkovjs-hangman.ru/
Больше крутого контента:
🚀 Telegram - t.me/pomazkovjs
👀 Instagram - instagram.com/pomazkov.js
что это вытворили) с реактом, там повторил за тобой уже не узнаю, что там ) написано впервые вижу так много с самого начала записей в файлах )
всё четко объяснил, спасибо
Спасибо БОЛЬШОЕ)!
Спасибо за видео. Очень хорошая форма подачи. Хотелось бы в такой же понятной форме разобрать вопрос про стейт менеджеры. Когда нужен Redux/MobX, когда ReactContext, а когда можно обойтись без них
Посмотрел твой материал. Блин, парень, продолжай. Очень жаль, что так мало видео пока. Я занимаюсь профессиональной разработкой 15 лет, но совсем в другой области. И сейчас есть необходимость сделать сайт, ищу материалы по фронту. Такой мощной, лаконичной и понятной подачи еще не видел
мужик, как же ты хорош!
Доступно и понятно, спасибо. Продолжай, у тебя хорошо получается. Хочу много уроков от тебя по реакту и JS
Прямо сейчас готовится ролик по this и еще много контента 🙌🏼
Привет
Походу самый понятный вводный урок по React на RUclips
Был рад пройти твой авторский курс по реакт
Красава, так держать
Подписался, поставил лайк, написал коммент
Огонь, спасибо!)
Спасибо, отлично объясняешь! Голосую за Vite!😄
Очень круто инфу доносишь, чувак хорош!!!
Шикарнейший гайд по Реакту
Очень понятно, последовательно и интересно. Я капризный, насчёт уроков и преподавателей. Этот урок мне зашёл на отлично. Вот если бы было продолжение. Например, как написать страничку соц. сети или планировщик задач...
интересно было земляк
Огромное спасибо рекомендациям Ютуба за такую находку, а также большое спасибо автору за контент
Спасибо за урок. А то начал было изучать nextjs, но понял что без знаний реакта там делать нечего. Урок подан отлично, обычно никто не объясняет что и для чего, а сразу начинают что то сложное городить.
Вы очень круто объясняете жду не дождусь новых видео про реакт
Приятно смотреть, 🎉
посмотрел 6 минут и уже узнал больше чем из всех видио на ютубе!! долби брат!!!
Красавец, спасибо
Ну , что тут сказать 140 коментов сами за себя говорят, это действительно лучшее видео на ютуб по реакту.
У меня всё получилось, всё заработало, всё понятно.
Можно же так объяснять, вот бы всегда всё шло так как в этом видео)
Ну тут определённо лайк, подписка со всех аккаунтов , рассылка всем друзьям и огромный респект!
СПАСИБО!!!!!!
Хорошо объясняешь, спасибо
Спасибо👍
Хорошее вводное видео, спасибо
Отличный урок!
В поддержку, хорошо объясняешь
Очень круто рассказал, низкий поклон тебе, теперь я понял! Лучшее объяснение на русско язычном ютубе!
Супер!
Очень доступно😁
Ай, молодец )))
спасибо болльшое за видео!
ОЧЕНЬ жду следующий ролик по реакту.
Надеюсь будет полный курс для джуна.
На ютубе много курсов но они либо не самые свежие +4 года либо рассказывают как попало.
Очень понятно объяснил, для чайников, прошу продолжай)
Ты суппер крутой! Спасибо!
спасибо за интересное и полезное видео
спасибо! лучший подход, когда новое видео?
крутой контент!
Не пишу комменты, но тут не смог удержаться - СПАСИБО!!!! лайк подписка. У тебя талант.
Записался на платные курсы, ни бум бум. на них react-vite устанавливали, а тут что так и не понял.
Видео очень понятное и интересное! Легкая подача материала позволяэт лучше усвоит урок!
Скажи пожалуйста, можем ли мы использовать в переменой значения PRIMARY KEY, AUTOINCREMENT?
Спасибо большое очень понятное объяснение
Всегда пожалуйста!
Хорошо обьясняешь. Я бы посмотрел от тебя разбор Event Loop
качество видео и подача супер! может что то про собесы запишешь или про первую работу?
Спасибо! Принято, подумаю над идеями)
Все круто! Давай теперь про vite
Засыпал под твой видос, после слов "мы не будем ничего удалять из стартового проекта как большинство ютуберов" проснулся, подписался, поставил лайк. Чел я слежу за тобой. Делай контент ❤
Вы очень крутой!!!!
Спасибо
супер контент/ жаль что мало его пока что
Очень хочется от вас все о реакте 🙏🙏🙏
спасибо
Было бы здорово, если ты выпустил видео про работу с многомерными ассоциативными массивами в React TS.
Вот это тут конкурентов, конечно... :DD
продолжай, пожалуйста!
Спасибо за видео. Про Vite также интересно.
Так понимаю Node.Js - это сервер поддержки проекта. ReacJs работает лишь с этим сервером. А не Nginx или другими?
Извините за наивный вопрос.
Арсений, будет продолжение этих обучающих роликов про реакт? Или ты просто для ознакомления сделал? Мне понравилась манера речи у тебя, мне прям все понятно как ты объясняешь
Планирую сделать продолжение, да)
Спасибо!
@@pomazkovjs 🔥
@@pomazkovjsесть новости?
Спасибо, что открыл дверь и простелил дорожку в мир реакт ))
Есть курс свой ?
Спасибо за видео :)
А можешь сделать видео о react-native!!!
Всегда пожалуйста)
Эта тема мне самому интересна, но боюсь, что не смогу полноценно раскрыть её - продакш-опыта с реакт-нейтив у меня нет. Спасибо за предложение, в любом случае!
Thanks
Вау :)
Про Git систему версий было бы очень интересно послушать!
Есть в планах!
Я хорошо знаю Vue, Nuxt. Нужно ли изучать react, next ?
круто разложил, дякую 👍👍 вподобайка + подписулька )) касательно "key" - считается плохой практикой передавать id в key.
id - это, как правило, неменяющийся идентификатор, поэтому передавать его в качестве key - это лучшая практика 🙂
Плохой практикой считается передавать индекс в key, так как индекс элемента массива как раз может измениться, если мы удалим что-то из массива или добавим в начало
VirtualDOM сравнивается не с реальным DOM.
Когда произошли изменения(изменилось состояние приложения), создается новый virtualDOM(легковесная копия реального DOM). Новая версия virtualDOM сравнивается со старой. Вычисляются "узлы", которые изменились. И на основе этих узлов изменяется части реального DOM, которые подверглись изменению.
Про Vite нужен гайд, спасибо!
Согласен
У меня выдает ошибку на команде rm-rf git. Написала ее правильно в терминал, пробовала другие команды. Почему так. Этот шаг можно пропустить?
На windows не подгружаются папки public и crs. Node v (18.17.1 LTS)
голосую за vite)))
Мир вам!
Можете сделать урок по Вит как пользоваться его Реакте
Наконец-то нашел хороший курс
Думал, что реакт это какая-то сложная чертовшина, но оказалось что с основами хтмл, жс, и питона(больше всего умею писать на C#, второе место С++) все понимаю!
UPD : жаль, что это всеголишь вводное видео, хотелось бы курс от вас
Спасибо! Собираюсь вернуться к нему и продолжить, подписывайтесь и следите 🙌🏼
Если поставил лайк или добавил видео в плейлист то не будет формироваться запрос к серверу и тот не будет возвращать новую страницу отличающуюся только тем, что у нее появилась галочка или иконка сердечко стало красным. Но при этом мы же должны сообщить серверу о том что добавили видео в плейлист, как это должно осуществляться , по технологии Ajax?