Учимся работать с Redux Toolkit (RTK) на примере управления продуктами и корзиной

В этом обучающем видео мы шаг за шагом создадим страницу интернет-магазина на React с использованием Redux Toolkit (RTK)! Вы узнаете, как настроить управление состоянием для списка продуктов и корзины, реализовать загрузку данных с API, добавление товаров в корзину и их удаление. Всё это на основе реального проекта с чистым и современным кодом. Что вы узнаете: - Как настроить Redux Toolkit в проекте React для управления состоянием. - Создание slice для продуктов и корзины с использованием createSlice. - Реализация функционала добавления, удаления и очистки корзины. - Интеграция с Ant Design для создания красивого UI. - Лучшие практики типизации с TypeScript и работы с Redux. Репа готового проекта из видео: 00:00 Вступление 01:20 Инициализация проекта "Счетчик" 03:12 Знакомимся с RTK 11:15 Установка и настройка первого store 16:56 Применяем CounterStore 23:41 Создание отдельных селекторов в store 28:54 Рефакторинг перед вторым проектом 30:20 Создание ProductsPage 31:20 Устанавливаем Redux devtools 32:56 Инициализация проекта "Продукты с корзиной" 50:01 Создание ProductsStore 58:10 Создание createAsyncThunk 01:02:50 Применяем ProductsStore в ProductsPage 01:02:50 Используем паттерн "Устаревшие данные" 01:09:30 Создание корзины товаров 01:17:22 Создание CartStore 01:21:52 Применяем CartStore 01:26:40 Создание метода "Очистка корзины" 01:29:05 Создание метода "Удаление товара из корзины" 01:33:31 Создание метода "Добавление товара в корзину" 01:37:08 Конец