React. Разработка сложных клиентских приложений «HTML Academy»

compare_arrows

Предполагается, что вы уже имеете понятие о том, что такое ООП, умеете устанавливать связь между компонентом и структурой данных и понимаете, как проектировать интерфейсы с асинхронным кодом.

Первая неделя

• Раздел 1. Знакомство с TypeScript. Рассмотрим схему работы на курсе. Узнаем что такое TypeScript, и какие задачи он решает. Познакомимся с системой типов и разберёмся, как происходит процесс типизации. Научимся конфигурировать компилятор и рассмотрим основные настройки. Затем перейдём к практике и разберёмся с особенностями написания типизированного кода: кортежи, интерфейсы, дженерики.
• Раздел 2. React. Знакомство с библиотекой React. Узнаем, какие проблемы она решает и как может упростить разработку фронтенда. Подготовим основу проекта с помощью инструмента «Create React App» (CRA). Научимся применять шаблоны для CRA. Затем познакомимся с основными возможностями библиотеки React (JSX, компоненты, передача данных между компонентами).
• Раздел 3. Маршрутизация (React Router). Узнаем как организована маршрутизация в SPA. Добавим в проект React Router и разберёмся с возможностями пакета: маршруты, перенаправления, приватные маршруты.

Вторая неделя

• Раздел 4. React-компоненты. Hooks. Расширим знания о React и компонентах. Научимся управлять состоянием, использовать события и методы жизненного цикла компонентов. Познакомимся с React Hooks и узнаем, как заменить ими классовые компоненты. Научимся работать с формами.
• Раздел 5. React и паттерны. Разбираемся с вопросом, что такое архитектура программного обеспечения и как её проектировать. Знакомимся и учимся на практике применять паттерны проектирования.

Третья неделя

• Раздел 6. Управление состоянием. Redux. Знакомимся с Flux-архитектурой: действия (Actions), диспетчеры (Dispatcher), представления (Views) и хранилища (Stores). Подключаем к проекту Redux и обновляем кодовую базу.
• Раздел 7. Асинхронность в Redux. Научимся внедрять асинхронный код в синхронную работу Redux с помощью Middleware. Узнаем как взаимодействовать с сервером при помощи пакета Axios. Познакомимся с интерцепторами.

Четвёртая неделя

• Раздел 8. Оптимизация производительности. Обсудим производительность React-приложений: какие есть особенности, на что следует обращать внимание при проектировании компонентов в первую очередь. Затем познакомимся с пакетом Redux Toolkit и узнаем как с его помощью избавиться от шаблонного кода при работе с Redux.

Пятая неделя

• Раздел 9. Тестирование React. Познакомимся с инструментами и методиками тестирования React-приложений. Настроим инфраструктуру для тестирования, напишем тесты для компонентов.

Шестая неделя

• Защита проекта. Подготовка проекта к итоговой защите и оценка его проверяющим наставником по критериям качества. 

Седьмая неделя

• Первая оценка проекта проверяющим наставником по критериям качества. Улучшение проекта по замечаниям проверяющего наставника и подача на вторую оценку.

Девятая неделя

• Раздел 10. Финал. Подведём итоги курса и определим дальнейший вектор изучения React и его экосистемы. Затем обсудим новые возможности React, которые ожидаются в будущих релизах. Внесение финальных правок и получение итоговой оценки.