Сложность
Сложность
Продвинутый
Тип обучения
Тип обучения
Курс
Трудоустройство
Трудоустройство
Отсутствует
Сертификат
Сертификат
Да

Стоимость курса

бесплатно
есть рассрочка

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

Что вас ждёт на обучении
Лайвы
Прямые эфиры, на которых преподаватели разбирают сложные моменты из теории и практики. Проходят с 19 до 21 по Москве, запись доступна на следующий день.
Практика
После лекции вы выполняете домашнее задание, в котором работаете над своим проектом и закрепляете учебный материал.
Ревью кода
Наставник будет проверять качество выполнения заданий и делиться опытом, как можно сделать лучше.


Что вы получите после обучения

Приобретаемые навыки
2
Redux
3
TypeScript
6
Git bash
Сертификат, ссылками на который можно делиться с другими людьми

Образовательная организация

Наша цель — сделать из любого новичка полноценного и востребованного специалиста, готового работать в веб-индустрии.

В 2013 году Саша и Лёша запустили HTML Academy. Мы с самого начала решили учить работать с живым кодом, решая задачи, приближенные к реальным. Мы даём возможность получить не только знания, но и умения. В процессе обучения мы сталкиваем ученика с испытаниями, принцип которых — «сверстай, как показано в образце». Именно по такому принципу работают большинство верстальщиков.

Мы считаем вёрстку очень полезным навыком для любой IT-специальности. Поэтому стараемся делать наши тренажёры максимально интересными, затягивающими, интерактивными, необычными, где-то похожими на игру.

Мы подготовили тренажёры, затрагивающие разные аспекты работы верстальщика. Этого достаточно, чтобы вплотную познакомиться с вёрсткой. А для тех, кто хочет вырасти в профессионала, мы подготовили шесть онлайн-курсов. Эти уникальные образовательные программы позволяют подготовить специалистов с необходимыми для веб-индустрии навыками. И в этом нам помогают наставники. Сейчас с нами работают более трёхсот наставников.

Если тренажёров и курсов вам будет мало, то можно посмотреть на книжную полку, где мы постепенно собираем книги по веб-разработке. Или зайти к нам на форум и обсудить волнующий вас вопрос.

Программа курса

Раздел 1 Знакомство с TypeScript
Рассмотрим схему работы на курсе. Узнаем что такое TypeScript, и какие задачи он решает. Познакомимся с системой типов и разберёмся, как происходит процесс типизации. Научимся конфигурировать компилятор и рассмотрим основные настройки. Затем перейдём к практике и разберёмся с особенностями написания типизированного кода: кортежи, интерфейсы, дженерики и так далее.

Организационные вопросы.

Обзор проектов.
Схема работы на курсе.

Введение в TypeScript.

Что такое TypeScript, и какие задачи он решает.
Система типов.
Как код на TypeScript превращается в JavaScript.
Инфраструктура: настройки компилятора.
Аннотации и автоматический вывод типов.

Практика применения TypeScript.

Типизация объектов, массивов, функций.
Дженерики.
Кортежи.
Интерфейсы, псевдонимы типов.

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

React.

Что такое React.
Как работает React.
Какие задачи эффективно решает.
Virtual DOM.

Инфраструктура.

Create React App.
TypeScript.

JSX

Чем отличается от HTML.
Основные приёмы работы.

Компонентный подход.

Компоненты React.
Пропсы. Передача данных через свойства.
Композиция.

Рендеринг компонентов.

Рендеринг списков.
Условный рендеринг.

Раздел 3 Маршрутизация (React Router)
Узнаем как организована маршрутизация в SPA. Добавим в проект React Router и разберёмся с возможностями пакета: маршруты, перенаправления, приватные маршруты и так далее.

Маршрутизация в SPA.
History API.
Компоненты Route, Link, Redirect.
Управление маршрутами.

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

Состояние.
Однонаправленный поток данных.
Функциональные компоненты, классовые компоненты, PureComponent.
Введение в React Hooks.

Методы жизненного цикла.

React и формы.

Раздел 5 React и паттерны
Разбираемся с вопросом, что такое архитектура программного обеспечения и как её проектировать. Знакомимся и учимся на практике применять паттерны проектирования.

Проектирование.

Чем отличается хорошая программа от плохой.
Зачем проектировать программное обеспечение. Цели проектирования.
Архитектура программного обеспечения.
Инструменты для проектирования.

Паттерны проектирования.

Какие проблемы решают паттерны.
Из чего состоит паттерн.
Виды паттернов проектирования.

Паттерны в React.

Простые компоненты (Stateless component).
Компоненты-обёртки (Proxy component).
Компоненты высшего порядка (Higher-order component).
Render Props.
Провайдер (Provider).
React Hooks и паттерны.

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

Flux-архитектура.
Хранилище, диспетчер, действия.

Redux.

Middlewares.

Расширение функциональности Redux.

Раздел 7 Асинхронность в Redux
Научимся внедрять асинхронный код в синхронную работу Redux с помощью Middleware. Узнаем как взаимодействовать с сервером при помощи пакета Axios. Познакомимся с интерцепторами.

Redux-thunk.

Axios.

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

Профилирование компонентов.
Управление обновлением компонентов.
Мемоизация.
Redux Toolkit.

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

Jest.
React Testing Library.

Первая неделя защиты
Завершение работы над проектом и подготовка к итоговой защите.

Вторая неделя защиты
Первая оценка проекта проверяющим наставником по критериям качества.

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

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

Четвёртая неделя защиты
Внесение финальных правок и получение итоговой оценки.

Рейтинг курса

4.2
рейтинг
1
0
0
0
0

Отзывы о курсе

1 отзыв
по рейтингу по дате
G
Gantelka

Очень понравилось!

Достоинства: 1) Актуальные материалы. 2) Грамотно выстроенный план обучения. 3) Доступная подача информации. 4) Индивидуальный подход. Недостатки: Обучение не самое дешевое, но частые розыгрыши и скидки в помощь. К тому же, полученные на курсах знания того стоят. Недавно закончила курс Htmlacademy "React. Разработка сложных клиентских приложений." Отличный курс! Много-много теории, и еще бол...

Может быть интересно

обновлено 24.03.2024 08:06
Онлайн‑курс React. Разработка сложных клиентских приложений

Онлайн‑курс React. Разработка сложных клиентских приложений

Оставить отзыв
Поделиться курсом с друзьями