JavaScript Профессиональный курс часть 3

Язык преподавания в курсе – русский. Вскоре будет доступна украинская версия этого курса.

Видеозаписи лекций без обратной связи и участия преподавателя. Вы получите доступ к материалам сразу после оплаты.

Курс предназначен для тех, кто прошёл «Профессиональный JavaScript, уровень 1»,  «Профессиональный JavaScript, уровень 2» или для разработчиков, желающих поднять свои навыки.
После прохождения курса вы будете уверенно создавать современные веб-приложения. Знать, как писать код, уметь его тестировать, а также умело применять паттерны проектирования.

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

– Актуальные стандарты качества: не нужно переучиваться после курса.

– Понимание полного цикла работы разработчика.

– Фундаментальные и структурированные знания необходимых технологий.

– Опыт работы с дедлайнами и планирования работы.

Раздел 1
React
Рассмотрим схему работы на курсе. Познакомимся с популярной библиотекой React. Узнаем какие проблемы она решает и как может упростить наш проект. Подготовим инфраструктуру для React-проекта, разберёмся как работают компоненты и JSX.

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

Что такое React.
– Как работает React.
– Какие задачи эффективно решает.
– Virtual DOM.
– React Component.
– Дополнительные инструменты.

JSX.

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

– Компоненты React.
– Свойства компонентов.
– Передача данных через свойства.
– Типизация свойств.
– Вложенные компоненты.

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

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

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

– Jest.
– Enzyme.
– PropTypes.

Раздел 3
state
Улучшим знания о React и компонентах. Разберём state, события и методы жизненного цикла компонента.

– state.
– Однонаправленный поток данных.
– Stateless-компоненты, PureComponent.

События.

– Обработка событий в компонентах.
– Synthetic React Events.
– Методы жизненного цикла.

React и формы.

Обработка ошибок.

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

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

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

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

– Простые компоненты (Stateless function).
– Условный рендеринг (Conditional Rendering).
– Компоненты-обёртки (Proxy component).
– Стилизация компонентов (Style component).
– Компоненты высшего порядка (Higher-order component).
– Переключение событий (Event switch).
– Render Props.
– Провайдер (Provider).
– Порталы (Portals).

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

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

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

– Parse и compile Time.
– Профилирование компонент.
– Управление обновлением компонент.
– Рендеринг длинных списков и таблиц.

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

– Thunk.
– Middleware.
– Взаимодействие с сервером.

Раздел 8
React Router
Знакомимся с маршрутизацией в SPA-приложениях. Добавляем в проект пакет react-router, создаём публичные и приватные маршруты.

– Роутинг.
– history API.
– Компоненты Route, Link.
– Приватные маршруты.
– Редиректы.
– Свернуть / Развернуть

Раздел 9
React и типизация
Познакомимся со статической типизацией. Обсудим, какие проблемы решает. Добавим к проекту TypeScript.

Статическая типизация.

Что это такое?
Плюсы минусы.
Статическая типизация для JS.
TypeScript и React.

Поддержка React в TypeScript.
Интерфейсы.