React. Разработка сложных клиентских приложений
Познакомимся с библиотекой React и научимся создавать сложные клиентские приложения. Курс рассчитан на начинающих разработчиков, которые уже освоили JS.
Старт курса
Длительность
31 мая 2021

2,5 месяца
React используют для разработки самых популярных фронтенд–приложений. На этом курсе вы на практике изучите все библиотеки, которые входят в экосистему: React Router, React Redux, React Thunk и другие.
Что вас ждет на обучении
Живые лекции
Лекции проходят по понедельникам и четвергам с 19:00 до 21:00 по московскому времени. Запись лекции доступна на следующий день.
Спикер не просто рассказывает сухую теорию, но постоянно общается с аудиторией и делится любопытными кейсами из личного опыта.

После каждой темы студенты выполняют задание на пару минут, чтобы сразу отработать знания и задать вопросы.
Практика
После лекции вы выполняете домашнее задание, в котором работаете над личным проектом и закрепляете учебный материал.
После лекции вы выполняете домашнее задание, в котором работаете над личным проектом и закрепляете учебный материал.
Ревью кода
После каждого задания ваш личный наставник проверяет качество работы, делится опытом и рассказывает, как можно сделать лучше.
Наставник проверяет домашку за 2 дня: дает развернутую обратную связь и отвечает на вопросы.

Если нужно — даст дополнительное задание, чтобы точно во всем разобраться.
Чему вы научитесь
1
2
3
4
Пользоваться библиотекой React
Настраивать инфраструктуру для React-проекта
Внедрять асинхронный код в синхронную работу Redux
Проектировать архитектуру ПО
и применять паттерны
5
Оптимизировать производительность
6
Тестировать React-приложения
По результатам курса вы научитесь создавать приложения правильно, чтобы после обучения выдавать результат высокого уровня.
Программа курса
Раздел 1
React
Развернуть
Раздел 1
React
Рассмотрим схему работы на курсе. Познакомимся с популярной библиотекой React. Узнаем, какие проблемы она решает и как может упростить наш проект. Подготовим инфраструктуру для React-проекта, разберёмся, как работают компоненты и JSX.
Организационные вопросы
- Схема работы на курсе.
- Обзор проектов.
- Что такое React.
- Как работает React.
- Какие задачи эффективно решает.
- Virtual DOM.
React
Свернуть тему
- Webpack.
Инфраструктура
- Рендеринг списков
- Условный рендеринг.

Рендеринг компонентов
JSX
Дополнительные инструменты
Компонентный подход
- Компоненты React.
- Свойства компонентов.
- Передача данных через свойства.
- Вложенные компоненты.
Раздел 2
Маршрутизация (React Router)
Развернуть
Раздел 2
Маршрутизация (React Router)
Знакомимся с маршрутизацией в SPA-приложениях. Добавляем в проект пакет react-router-dom, создаём публичные и приватные маршруты.
Роутинг
History API
Свернуть тему
Компоненты Route, Link
Приватные маршруты
Редиректы
Практика
- Подключение react-router.
- Добавление публичных и приватных маршрутов.
- Добавление вспомогательных библиотек в проект.
Раздел 3
React-компоненты. Hooks
Развернуть
Раздел 3
React-компоненты. Hooks
Улучшаем знания о React и компонентах. Разберём state, события и методы жизненного цикла компонента. Познакомимся с React Hooks и узнаем, как с их помощью заменить class-компоненты.
- state.
- Однонаправленный поток данных.
- Функциональные компоненты, классовые компоненты, PureComponent.
- Введение в React Hooks.
Свернуть тему
Методы жизненного цикла
React и формы
- Добавление state компонентам.
- Обработка форм.
Практика
Раздел 4
React и паттерны
Развернуть
Раздел 4
React и паттерны
Разбираемся, что такое архитектура программного обеспечения и как её проектировать. Учимся применять паттерны проектирования.
- Чем отличается хорошая программа от плохой.
- Зачем проектировать программное обеспечение. Цели проектирования.
- Архитектура программного обеспечения.
- Инструменты для проектирования.
- Какие проблемы решают паттерны.
- Из чего состоит паттерн.
- Виды паттернов проектирования.
- Простые компоненты (Stateless component).
- Компоненты-обёртки (Proxy component).
- Компоненты высшего порядка (Higher-order component).
- Render Props.
- Провайдер (Provider).
- React Hooks и паттерны.
Проектирование
Паттерны проектирования
Паттерны в React
Свернуть тему
- Улучшение проекта, применение паттернов на практике.
Практика
Раздел 5
Redux
Развернуть
Раздел 5
Redux
Познакомимся с Flux-архитектурой: действия (Actions), диспетчеры (Dispatcher), представления (Views) и хранилища (Stores). Подключим к проекту Redux и обновим кодовую базу.
- Flux-архитектура.
- Хранилище, диспетчер, действия.
- Подключение к проекту Redux.
- Обновление кодовой базы.
Redux
Middlewares
Практика
Свернуть тему
Раздел 6
Асинхронность в Redux
Развернуть
Раздел 6
Асинхронность в Redux
Научимся внедрять асинхронный код в синхронную работу Redux с помощью Middleware.
redux-thunk
Свернуть тему
- Загрузим данные с сервера с помощью middleware redux-thunk.
Практика
Раздел 7
Оптимизация производительности
Развернуть
Раздел 7
Оптимизация производительности
Поговорим о производительности React-приложений: какие есть особенности, на что следует обращать внимание при проектировании компонентов в первую очередь.
- Профилирование компонентов.
- Управление обновлением компонентов.
- Профилирование компонентов.
Практика
Свернуть тему
Раздел 8
Тестирование React
Развернуть
Раздел 8
Тестирование React
Познакомимся с инструментами и методиками тестирования React-приложений. Настроим инфраструктуру для тестирования, напишем тесты для созданных компонентов.
- Jest.
- React Testing Library.
- Настройка инфраструктуры для тестирования.
- Применение методик тестирования.
- Тестирование компонентов.
Практика
Свернуть тему
Раздел 9
Будущее React
Развернуть
Раздел 9
Будущее React
Продолжим обсуждать тему тестирования. Научимся тестировать асинхронные операции. Затем обсудим новые экспериментальные возможности React и типизацию.
- Практика тестирования.
Вектор развития
Concurrent Mode
TypeScript
Практика
Свернуть тему
Раздел 10
Итоговый проект
Развернуть
Модуль 9
Итоговый проект
Защита проекта состоит из четырех этапов (по неделе на каждый этап):
1. Начало подготовки к итоговой защите;
2. Первая оценка проекта проверяющим наставником по критериям качества;
3. Улучшение проекта по замечаниям проверяющего наставника и подача на вторую оценку;
4. Внесение финальных правок и получение итоговой оценки.
Свернуть тему
1 этап
Как мы отбираем наставников
Мы убеждены, что обратную связь ученику должен давать опытный специалист, который прямо сейчас работает на рынке, решает современные задачи, использует актуальные подходы и инструменты. Мы отбираем наставников в три этапа.
2 этап
3 этап
После каждого курса мы собираем обратную связь, которая помогает наставникам совершенствоваться.
Проверяем, кем и где кандидат в наставники работал, какой у него опыт, смотрим на его код
Проводим собеседование,
на котором проверяем знание предметной области и умение объяснять тему
Проверяем, кем и где кандидат в наставники работал, какой у него опыт, смотрим на его код.
Стоимость обучения
Стандартный курс
5 часов работы с личным наставником
24 030 ₽
ПРЕМИУМ КУРС
9 часов работы с личным наставником
26 700 ₽
Цена со скидкой
35 730 ₽
39 700 ₽
Цена со скидкой
Бесплатная консультация
Познакомимся, поможем понять, работает ли курс на ваши цели.
Расскажем, как проходит урок и как отвечают наставники.
Ответим на вопросы об оплате.
Оставляя заявку, вы принимаете
условия соглашения