# Неделя #4 Продолжаем изучать Redux. Пишем первые тесты

# Подготовка к выполнению задания

Изучить все материалы четвертой недели курса в Личном кабинете.

# Что нужно сделать?

# Выполнить домашнее задание #7 (Пицца!)

Готовим пиццу! В данной работе нужно написать единственный редьюсер, который обрабатывает заказы на пиццу. Все компоненты работают только с одним массивом заказов, но, все данные в этом заказе уже есть. Посмотрите с помощью redux-dev-tools какие экшены отправляются по нажатию на кнопки. Все компоненты присутствуют, коннекты тоже, ваша задача — разобраться с редьюсерами.

Порядок работы:

Переключитесь в ветку homework-7-pizza
Ознакомиться с примером работы, чтобы понять, как будет выглядеть финальное приложение.
Изучите cypress/integration/homework.spec.js чтобы понять какой функционал должен быть реализован.
Начните работу с src/reducers/orders.js. В нем необходимо определить редьюсер для обработки заказов.

# Выполнить домашнее задание #8 (TV Maze catalog)

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

Требования к домашнему заданию:

Для работы с api в репозитории будет находится фаил src/api.js с готовыми функциями для поиска и получения сериала по id.
Сетевые запросы должны совершаться из middleware.
Для работы с асинхронными запросами нужно воспользоваться 3 экшенами _REQUEST, _SUCCESS, _FAILURE.
Для создания всех экшенов использовать метод createAction из библиотеки redux-actions.
Для описания редьюсеров желательно использовать метод handleActions из библиотеки redux-actions.
Для каждого сериала url страницы должен выглядеть как /shows/:id где id — id сериала с сайта tvmaze.com.
При переходе на страницу сериала из поиска должен совершать сетевой запрос за информацие о сериале, и в это время нужно отражать надпись, сообщающую о том, что происходит загрузка.
При поиске на странице поиска также должна выводиться надпись о том, что происходит загрузка, пока происходит сетевой запрос.
Выдача результатов поиска должна содержать картинки, краткое содержание и ссылку на страницу сериала.

Подсказки Поле summary в ответах на запросы api.tvmaze.com содержит описание вместе с html тегами. Чтобы вывести html в реакте, воспользуйтесь методом dangerouslySetInnerHTML:

<div dangerouslySetInnerHTML={{__html: summary}} />

Порядок работы:

Переключитесь в ветку homework-8-tv-maze-catalog
Ознакомиться с примером работы.
Изучите cypress/integration/homework.spec.js чтобы понять какой функционал должен быть реализован.
Начните работу с AppRouter.js. В нем необходимо определить роутер вашего приложения.
Реализуйте страницу поиска в файле Search.js вам также потребуется реализовать компонент ShowPreview.
Реализуйте страницу шоу ShowPage.
Создайте редьюсеры show и search. Используйте метод combineReducers. Для начала можете захардкодить данные.
Создайте стор в store.js.
Подключите redux к вашим компонентам при помощи connect.
Реализуйте searchMiddleware и showMiddleware. В них вы будете выполнять запросы на сервер.

# Как всё успеть?

Данный план является примерным ориентиром. Вы всегда можете работать в удобном для себя темпе.

# 🗓 Понедельник

Изучаем материалы модуля "II Redux-saga".

Клонируем домашнее задание 7 и выполняем его.

Готовим вопросы к данному модулю.

# 🗓 Вторник

Изучаем материалы модуля "Тестирование".

Продолжаем работу над домашним заданием 7.

# 🗓 Среда

Работа над домашним заданием №7.

Готовим вопросы к данному модулю.

# 🗓 Четверг

Сдаём домашнее задание 7 на проверку.

Изучаем материалы модуля "Работа со стилями".

Клонируем домашнее задание 8, осваиваемся с исходниками.

Готовим вопросы к данному модулю.

# 🗓 Пятница

Работа над домашним заданием №8.

Сдаём домашнее задание 7 на проверку.

Сдаём домашнее задание 8 на проверку.

Участвовать в практическом вебинаре.