Придбаний Современный React с Нуля (2022)

[Gadzhi]

Современный React с Нуля (2022)

Применение самой популярной JS библиотеки, используя современный подход хуков и функциональных компонентов!


Чему вы научитесь

• Как работает React
• Создание React компонентов
• Создание пользовательских интерфейсов
• Что такое props и two-way binding
• Cобытия и состояние для создания интерактивных приложений
• Как React работает под капотом
• Работа со списками и контентом по условию
• Способы стилизации компонентов
• Хуки

Спойлер: Информация

• Введение
  01:35
• Предпросмотр05:53
• Предпросмотр10:07
• Предпросмотр01:57
• Альтернативы React (Angular, Vue)
  03:40
• Обзор Курса
  08:06
• Настраиваем Инструменты Разработки
  04:24

• Код Приложения "Учёт Расходов"
  00:06
• Предпросмотр05:22
• Компоненты - Фундаментальные Блоки Приложений React
  08:04
• Декларативное Программирование
  03:47
• Создание Проекта
  09:47
• Подготовка Проекта
  03:27
• Обзор Проекта React
  11:51
• Знакомство с JSX
  03:49
• Как Работает React
  05:10
• Создание Компонента
  09:00
• Более Сложный JSX код
  04:33
• Добавление CSS Стилей
  06:03
• Отображение Динамических Данных в JSX
  09:16
• Передача Данных при Помощи props
  14:30
• JavaScript Логика в Компонентах
  07:21
• Разделение Компонента на Несколько Компонентов
  11:30
• Задание 1
  02:46
• Задание 1. Решение
  06:51
• Композиция (props.children)
  15:54
• Первые Итоги
  04:24
• Подробнее о JSX
  08:15
• Организация Файлов Компонентов
  03:14
• Альтернативный Синтаксис Функций
  03:49

• 
  
  
  • Краткий Обзор Раздела
    02:30
  • "Прослушивание" Событий и Работа с Обработчиками Событий
    09:06
  • Как Выполняются Функции-Компоненты
    07:04
  • Работа с "Состоянием"
    12:21
  • Подробнее о Хуке "useState"
    06:58
  • Добавление Формы Ввода
    08:32
  • Прослушивание Ввода Пользователя
    05:17
  • Работа с Несколькими Состояниями
    06:56
  • Использование Одного Состояния
    06:01
  • Обновление Состояния, Зависящего от Предыдущего Состояния
    05:42
  • Обработка Отправки Формы
    06:16
  • Добавление Двустороннего Связывания
    03:39
  • Коммуникация Компонентов Наследник-Родитель (Снизу Вверх)
    17:15
  • Подъём Состояния Вверх
    07:32
  • Задание 2
    03:02
  • Задание 2. Решение
    09:15
  • Компоненты - Контролируемые vs Неконтролируемые, с Состоянием vs без Состояния
    07:49

• Краткий Обзор Раздела
  01:04
• Отображение Списков Данных
  08:23
• Использование Списков с Состоянием
  06:06
• Keys
  07:13
• Задание 3
  01:32
• Задание 3. Решение
  06:15
• Отображение Контента по Условию
  09:15
• Возвращение Значения по Условию
  07:28
• Задание 4
  01:22
• Задание 4. Решение
  07:11
• Добавляем Диаграмму Расходов
  08:42
• Динамические Стили
  08:20
• Завершаем Разработку Приложения
  16:09

• 
  
  
  • Хорошая Новость!
    00:09

• Краткий Обзор Раздела
  06:05
• Динамическое Добавление Стилей Inline
  09:47
• Динамическое Добавление CSS Классов
  04:42
• Знакомство со Styled Components
  09:13
• Styled Components и Динамические Props
  11:48
• Styled Components и Media Queries
  02:31
• Использование CSS Модулей
  06:46
• Динамические Стили и CSS Модули
  05:47

• 
  
  
  • Краткий Обзор Раздела
    02:07
  • Сообщения об Ошибках в React
    06:28
  • Анализ Кода и Предупреждения
    06:42
  • Работа с Breakpoints
    06:09
  • Использование React DevTools
    05:35

• Краткий Обзор Раздела
  04:46
• Добавление Компонента CreateUser
  06:17
• Добавление Компонента Card
  09:33
• Добавление Компонента Button
  04:55
• Управление Состоянием Ввода Данных
  06:46
• Добавление Валидации и Логики Сброса
  05:11
• Добавление Компонента UserList
  09:58
• Управление Списком Пользователей Через Состояние
  12:07
• Добавление Компонента ErrorModal
  09:19
• Управление Состоянием Ошибок
  09:21

• 
  
  
  • Краткий Обзор Раздела
    01:10
  • Ограничения JSX
    06:35
  • Создание Компонента Обёртки. Фрагменты
    05:24
  • Порталы
    06:19
  • Работа с Порталами
    14:23
  • Работа с refs
    13:02

• Краткий Обзор Раздела
  01:39
• Что Такое Побочные Эффекты
  07:42
• Использование Хука useEffect
  13:32
• useEffect и Зависимости
  07:42
• Использование Функции Очистки
  09:53
• Reducers
  09:48
• Использование Хука useReducer
  16:48
• useReducer и useEffect
  10:18
• useState vs useReducer
  03:20
• Context
  07:04
• Использование Context API
  09:18
• Использование Хука useContext
  01:52
• Динамический Context
  04:30
• Кастомный Компонент Context Provider
  10:01
• Ограничения Context
  03:19
• Правила Хуков
  05:13
• Рефакторинг Компонента Input
  07:18
• forwardRef & useImperativeHandle
  14:00

• 
  
  
  • Предпросмотр02:28
  • Создание Структуры Проекта
    04:51
  • Добавление Компонента Header
    06:33
  • Добавление Компонента HeaderCartButton
    05:13
  • Добавление Компонентов для Отображения Блюд
    08:30
  • Отображение Блюд
    09:08
  • Добавление Формы
    08:16
  • Исправление Небольшого Бага
    05:08
  • Добавление Компонента Cart
    05:42
  • Добавление Модального Окна
    06:45
  • Управление Состоянием Cart и Modal
    09:02
  • Добавление Контекста Cart
    07:18
  • Использование Контекста
    05:24
  • Добавление Reducer в Cart
    11:40
  • Использование refs
    12:09
  • Отображение Элементов Корзины
    07:45
  • Усложнение Логики Reducer
    07:08
  • Добавление Функциональности Удаления Элементов
    09:46
  • Использование useEffect
    07:41

• Краткий Обзор Раздела
  01:46
• Как Работает React
  07:42
• Обновление Компонентов
  08:54
• Переоценка Дочернего Компонента
  13:39
• Предотвращение Ненужных Переоценок при Помощи React.memo()
  11:41
• Предотвращение Пересоздания Функций при Помощи useCallback()
  04:58
• useCallback & dependencies
  08:00
• Первые Итоги
  05:09
• Подробнее о Состоянии и Компонентах
  04:06
• Планирование Состояний
  04:28

• 
  
  
  • Краткий Обзор Раздела
    01:54
  • Что Такое Компоненты на Основе Классов?
    03:35
  • Первый Компонент на Основе Класса
    06:55
  • Работа с Состояниями и Событиями
    11:00
  • Жизненный Цикл Компонентов на Основе Классов
    07:41
  • Life-cycle Методы
    11:01
  • Компоненты на Основе Классов и Контекст
    04:11
  • Компоненты на Основе Классов vs Функциональные Компоненты
    02:40
  • Error Boundaries

• https://www.udemy.com/course/react-np/