[Илья Фофанов] [Stepik] React - Полное руководство (2023)
Для кого этот курс:
Для новичков, желающих в краткие сроки "въехать" в разработку с помощью React JS
Данный курс предназначен для тех, кто много слышал о библиотеке React, но при этом ни разу полноценно не пробовал поработать с ней.
Обучение построено вокруг небольшого учебного проекта, который вы начнете разрабатывать практически с первых лекций.
Таким образом, по мере разработки вы будете гармонично подходить к каждой следующей теме, изучая ее применительно к тому, над чем работаете.
Это позволит избежать набора не сильно связанных между собой тем, которые разобраны на изолированных друг от друга примерах.
Вы изучите все основные современные технологии библиотеки React, а также две крупные библиотеки, без которых современная react-разработка почти не встречается: React Router и Redux Toolkit.
Курс даётся сразу с точки зрения функциональных компонентов, но при этом есть лекции с разбором компонентов на основе классов.
Для комфортного прохождения курса вам необходимы базовые знания HTML + CSS + JS.
Последнему в курсе посвящены несколько лекций - тем темам JS, без понимания которых вам будет сложнее разобраться в React.
По окончании данного курса вы сможете:
- реализовывать пользовательские интерфейсы на React
- правильно логически разделять приложение на компоненты
- научитесь связывать компоненты между собой, как используя технологию props, так и с - помощью глобального стейта, применяя встроенные возможности React, такие, как useContext, или стейтменеджер Redux Toolkit
- освоите создание маршрутизации в приложении
- научитесь работать с параметрами запроса и даже делать динамический контент в рамках участка страницы в зависимости от текущего URL адреса.
Помимо фундаментальных тем, на курсе разбираются более широкие аспекты разработки: виды стилизации компонентов, более продвинутые хуки и работа React “под капотом”. Для удобства прохождения курс разбит на 50 основных лекций, которые посвящены самой библиотеке React + дополнительные лекции по нативному языку JavaScript, которые помогут вам лучше понять основной материал.
Программа курса:
JS необходимый для курса
- Репозиторий кода для курса
- Переменные
- Шаблонный литерал. Динамика в строках
- Условный оператор if
- Тернарный оператор
- Оператор нулевого слияния и &&
- Метод foreach
- Массивы - метод Find
- Массивы - метод Filter
- Массивы - метод Map
- Массивы - метод Reduce
- Что такое React
- Знакомство с синтаксисом
- Создаём первый компонент
- JSX разметка. Синтаксис и размещение элементов
- Композиция компонентов, родители и потомки
- Динамические значения и выражения в JSX
- ДЗ для самостоятельной работы
- Под капотом JSX
- ДЗ для самостоятельной работы
- Установка шаблона приложения CreateReactApp
- Подготовка структуры проекта
- Подготовка файлов для будущих компонентов
- Styled Components. Стилизация
- ДЗ для самостоятельной работы
- React Props - передача данных между компонентами
- Как работают пропсы с точки зрения JS
- Пропсы в Styled Components
- ДЗ для самостоятельной работы
- Состояние, реактивность, useState
- state vs props. Практика работы с состоянием
- Поднятие состояние. Более совершенная передача данных
- ДЗ для самостоятельной работы
- Рендеринг списков в React
- Практика работы со списками
- ДЗ для самостоятельной работы
- Возможности условного рендеринга
- Улучшаем компонент статистики
- Добавляем новые компоненты из MUI
- Используем Nivo
- ДЗ для самостоятельной работы
- Фрагменты - удобная группировка элементов
- useState и использование предыдущего значения состояния
- useState и сложные типы данных
- useEffect - использование зависимостей
- ДЗ для самостоятельной работы
- Разбор типов роутинга
- Построение базовых маршрутов приложения
- useNavigate и useParams
- useSearchParams
- Советы по маршрутизации, маршрут индексной страницы, маршрут заг
- Применяем новые знания в приложении
- ДЗ для самостоятельной работы
- Концепции рендеринга, иммутабельность элементов, принцип объектн
- Классовые компоненты, работа с состоянием и пропсами
- Жизненный цикл компонента и его методы
- setState, привязка контекста внутри классовых компонентов
- ДЗ для самостоятельной работы
- Работа с состоянием - продвинутый уровень
- Знакомство с Redux Toolkit
- Редюсер и слайс
- Глобальное состояние. useSelector и useeDispatch
- Продолжаем применять Redux в приложении
- Вынос всего ключевого состояния
- ДЗ для самостоятельной работы
- Особенности компонентов высшего порядка
- Расширение функционала с помощью HOC
- Виды стилизации и ещё немного о HOC
- ДЗ для самостоятельной работы
- useRef и useContext
- useMemo
- useCallback
- Создание пользовательских хуков
- ДЗ для самостоятельной работы
- реализовывать пользовательские интерфейсы на React
- правильно логически разделять приложение на компоненты
- научитесь связывать компоненты между собой, как используя технологию props, так и с помощью глобального стейта, применяя встроенные возможности React, такие, как useContext, или стейтменеджер Redux Toolkit
- Заключение
Вам необходимо зрегистрироваться для просмотра ссылок
Скачать:
 📥 Скрытое содержимое! Войдите или Зарегистрируйтесь