Курс разработан для тех, кто хочет сменить профессию и стать высокооплачиваемым профессионалом. Он подойдёт для работающих людей, у которых мало времени.
Первая неделя
Раздел 1
React
Рассмотрим схему работы на курсе. Познакомимся с популярной библиотекой React. Узнаем какие проблемы она решает и как может упростить наш проект. Подготовим инфраструктуру для React-проекта, разберёмся как работают компоненты и JSX.
Организационные вопросы.
- Обзор проектов.
- Схема работы на курсе.
React.
- Что такое React.
- Как работает React.
- Какие задачи эффективно решает.
- Virtual DOM.
JSX.
Инфраструктура
Дополнительные инструменты.
Компонентный подход.
- Компоненты React.
- Свойства компонентов.
- Передача данных через свойства.
- Вложенные компоненты.
Рендеринг компонентов.
- Рендеринг списков.
- Условный рендеринг.
Раздел 2
Тестирование React
Познакомимся с инструментами и методиками тестирования React-приложений. Настроим инфраструктуру для тестирования, напишем тесты для созданных компонентов.
Вторая неделя
Раздел 3
state
Теоретическая лекция
Улучшим знания о React и компонентах. Разберём state, события и методы жизненного цикла компонента.
- state.
- Однонаправленный поток данных.
- Функциональные компоненты, классовые компоненты, PureComponent.
Методы жизненного цикла.
React и формы.
Раздел 4
React и паттерны
Разбираемся с вопросом, что такое архитектура программного обеспечения и как её проектировать. Знакомимся и учимся на практике применять паттерны проектирования.
Проектирование.
- Чем отличается хорошая программа от плохой.
- Зачем проектировать программное обеспечение. Цели проектирования.
- Архитектура программного обеспечения.
- Инструменты для проектирования.
Паттерны проектирования.
- Какие проблемы решают паттерны.
- Из чего состоит паттерн.
- Виды паттернов проектирования.
Паттерны в React.
- Дочерние компоненты.
- Компоненты-обёртки (Proxy component).
- Компоненты высшего порядка (Higher-order component).
- Render Props.
- Провайдер (Provider).
Третья неделя
Раздел 5
Redux
Знакомимся с Flux-архитектурой: действия (
Actions), диспетчеры (
Dispatcher), представления (
Views) и хранилища (
Stores). Подключаем к проекту Redux и обновляем кодовую базу.
- Flux-архитектура.
- Хранилище, диспетчер, действия.
Redux.
Middlewares.
Раздел 6
Оптимизация производительности
Поговорим о производительности React-приложений: какие есть особенности, на что следует обращать внимание при проектировании компонентов в первую очередь.
- Профилирование компонент.
- Управление обновлением компонент.
Четвёртая неделя
Раздел 7
Асинхронность в Redux
Научимся внедрять асинхронный код в синхронную работу Redux с помощью Middleware.
redux-thunk
Пятая неделя
Раздел 8
React Router
Знакомимся с маршрутизацией в SPA-приложениях. Добавляем в проект пакет react-router-dom, создаём публичные и приватные маршруты.
- Роутинг.
- History API.
- Компоненты Route, Link.
- Приватные маршруты.
- Редиректы.
Раздел 9
React и типизация
Познакомимся со статической типизацией. Обсудим, какие проблемы она решает. Добавим к проекту TypeScript.
Статическая типизация.
- Что это такое?
- Плюсы минусы статической типизации.
- Статическая типизация для JS.
TypeScript и React.
- Поддержка React в TypeScript.
- Интерфейсы.
