В этом уроке вы изучите React с нуля и создадите свой первый проект с использованием Vite. Разберём ключевые темы: компоненты, props, состояния (state), обработка событий, условный рендеринг и работа с формами. Урок подойдёт новичкам и тем, кто хочет быстро освоить современную разработку на React и понять структуру проектов на практике. Записаться на курс "Основы React для начинающих" на Stepik, чтобы получить больше практики: https://stepik.org/a/259789 00:00:00 Что такое React и для чего он нужен 00:01:57 Онлайн редактор для React 00:04:46 Установка редактора VS Code и Node.js c NPM 00:07:32 Создание проекта React 00:13:33 Завершить компиляцию и открыть проект в редакторе 00:16:32 Работа с Vite 00:20:35 Что такое компоненты на React 00:27:28 Структура проекта React 00:37:01 Упрощаем проект для лучшего понимания 00:42:33 Создание своего компонента 00:49:57 Выносим компонент в отдельный файл 00:56:33 Интерполяция и импорт изображений 01:00:52 Свойства props и динамические данные в компоненте 01:05:42 Деструктуризация 01:07:43 Импорт стилей для отдельного компонента 01:11:35 Что такое Children у компонента 01:13:22 Обработчики событий на React 01:18:54 Состояния для динамического рендера 01:25:13 Пример кода с отображением времени на странице 01:31:14 Тернарный оператор 01:34:30 Несколько вариантов условного отображения 01:37:41 Стили для активной кнопки 01:41:37 Инлайновые стили 01:45:38 Изоляция стилей отдельного компонента 01:50:18 Создание нового компонента для работы с формами 01:54:59 Работа с полем ввода input 01:59:19 Работа с выпадающим списком select 02:03:37 Простая валидация формы Кайдзен разработка, чтобы бесплатно изучить основы HTML, CSS, JS - https://stepik.org/208758 💡 Телеграм - https://t.me/itdoctor_official/4 🎥 Курсы на Stepik - https://stepik.org/users/ITDoctor/teach ⚡️ Эксклюзив на Boosty - https://boosty.to/itdoctor YouTube - https://youtube.com/@ITDoctor Дзен - https://dzen.ru/itdoctor ВК - https://vk.com/itdoctorstudio Rutube - https://rutube.ru/channel/23500045/ #itdoctor #react