React и Redux: функциональная веб-разработка

Предисловие................................................................................................11

Условные обозначения...............................................................................11
Использование примеров кода...................................................................12
Благодарности...........................................................................................13
Глава 1. Добро пожаловать в React.........................................................14
Препятствия и трудности...........................................................................15
React как библиотека..........................................................................15
Новый синтаксис ECMAScript................................................................15
Популярность функционального JavaScript..........................................15
Утомительный JavaScript......................................................................16
Почему React будет не трудно изучить................................................16
Будущее библиотеки React.........................................................................17
Нужно идти в ногу со временем.................................................................17
Работа с файлами......................................................................................18
Файловый репозиторий.......................................................................18
Инструменты React-разработчика .......................................................19
Установка Node.js................................................................................19
Глава 2. Новый синтаксис JavaScript.......................................................21
Объявление переменных в ES6..................................................................22
const...................................................................................................22
let........................................................................................................22
Шаблонные строки..............................................................................24
Параметры по умолчанию...................................................................26
Стрелочные функции.................................................................................26
Транспиляция ES6......................................................................................30
Объекты и массивы ES6.............................................................................31
Деструктурирующее присваивание......................................................31
Расширения объектных литералов.......................................................33
Оператор распространения.................................................................34
Промисы....................................................................................................36
Классы.......................................................................................................37
Модули ES6................................................................................................39
CommonJS..................................................................................................41
Глава 3. Функциональное программирование
с применением JavaScript..........................................................................42
Значение понятия функциональности........................................................43
Сравнение императивности с декларативностью........................................45
Функциональные концепции......................................................................47
Неизменяемость..................................................................................47
Чистые функции..................................................................................50
Преобразование данных......................................................................52
Функции высшего порядка..................................................................59
Рекурсия.............................................................................................60
Композиция.........................................................................................63
А теперь все вместе............................................................................65
Глава 4. Чистый React................................................................................70
Настройка страницы..................................................................................70
Виртуальная DOM......................................................................................71
Элементы React..........................................................................................73
ReactDOM...................................................................................................75
Дочерние элементы...................................................................................76
Конструирование элементов с данными.....................................................78
Компоненты React......................................................................................80
React.createClass..................................................................................81
React.Component.................................................................................83
Функциональные компоненты, не имеющие состояния........................84
Отображение DOM.....................................................................................85
Фабрики.....................................................................................................88
Глава 5. React с JSX....................................................................................91
Элементы React в виде кода JSX................................................................91
Советы по применению JSX........................................................................92
Вложенные компоненты......................................................................92
className............................................................................................93
Выражения JavaScript..........................................................................93
Вычисление.........................................................................................93
Отображение массивов на JSX.............................................................93
Babel..........................................................................................................94
Введение в Webpack................................................................................103
Загрузчики Webpack...........................................................................104
Приложение кулинарных рецептов с применением сборки, выполняемой Webpack....104
Глава 6. Свойства, состояние и дерево компонентов..........................118
Проверка свойств.....................................................................................118
Проверка свойств при использовании createClass...............................119
Свойства, используемые по умолчанию..............................................123
Настраиваемая проверка свойств.......................................................124
Классы ES6 и функциональные компоненты,
не имеющие состояния.......................................................................125
Ссылки.....................................................................................................128
Обратный поток данных.....................................................................130
Ссылки в функциональных компонентах,
не имеющих состояния.......................................................................132
Управление состоянием React..................................................................133
Внедрение состояния компонента......................................................133
Инициализация состояния из свойств.................................................137
Состояние внутри дерева компонента......................................................139
Новый взгляд на приложение органайзера цветов.............................140
Передача свойств вниз по дереву компонентов..................................141
Передача данных вверх по дереву компонентов.................................144
Глава 7. Усовершенствование компонентов.........................................149
Жизненные циклы компонентов...............................................................149
Жизненный цикл установки................................................................150
Жизненный цикл обновления.............................................................154
React.Children.....................................................................................164
Подключение библиотек JavaScript..........................................................166
Создание запросов с помощью Fetch..................................................166
Подключение D3 Timeline...................................................................168
Компоненты высшего порядка.................................................................174
Управление состоянием за пределами React............................................180
Flux..........................................................................................................182
Представление...................................................................................184
Действия и создатели действий..........................................................185
Диспетчер..........................................................................................186
Хранилища.........................................................................................187
А теперь все вместе...........................................................................188
Реализации Flux.................................................................................188
Глава 8. Redux...........................................................................................190
Состояние................................................................................................191
Действия..................................................................................................194
Преобразователи.....................................................................................197
Преобразователь цвета......................................................................200
Преобразователь цветов....................................................................202
Преобразователь сортировки.............................................................204
Хранилище...............................................................................................205
Подписка на хранилища.....................................................................208
Сохранение в localStorage...................................................................209
Создатели действий.................................................................................210
Функции промежуточного звена...............................................................213
Глава 9. React Redux................................................................................217
Явная передача хранилища.....................................................................219
Передача хранилища через контекст.......................................................222
Сравнение презентационных
и контейнерных компонентов...................................................................226
Провайдер React Redux............................................................................230
Функция connect библиотеки React Redux................................................231
Глава 10. Тестирование...........................................................................234
ESLint.......................................................................................................234
Тестирование Redux.................................................................................238
Разработка, основанная на тестировании...........................................239
Тестирование преобразователей........................................................240
Тестирование хранилища...................................................................248
Тестирование компонентов React.............................................................251
Настройка среды Jest.........................................................................251
Enzyme...............................................................................................252
Имитация компонентов......................................................................255
Тестирование на основе отображения
мгновенного состояния (Snapshot Testing)................................................263
Использование данных об охвате кода.....................................................268
Глава 11. Маршрутизатор React Router.................................................282
Встраивание маршрутизатора..................................................................283
Вложенные маршруты..............................................................................288
Использование страничного шаблона.................................................288
Подразделы и подменю......................................................................290
Параметры маршрутизатора.....................................................................294
Добавление страницы с информацией о цвете...................................295
Перемещение состояния сортировки цветов в маршрутизатор...........300
Глава 12. React и сервер..........................................................................304
Сравнение изоморфизма с универсализмом.............................................305
Код React, отображаемый на сервере.......................................................308
Универсальный органайзер цветов..........................................................314
Универсальный Redux........................................................................316
Универсальная маршрутизация..........................................................318
Обмен данными с сервером.....................................................................325
Выполнение действий на сервере.......................................................326
Действия с Redux Thunks....................................................................329