Задание 6: Проектирование сущностей

Продолжительность: 9 мин

В этом упражнении мы реализуем модель для сущности Ratings, которая представляет рейтинг ресторана и список его отзывов.

Сущность будет использоваться в двух частях модуля ресторана: Сверху страницы — краткое резюме (средний рейтинг и количество оценок). Внизу страницы — полный список отзывов.

Входные данные из API

Данные об отзывах предоставляются сервером с двух эндпоинтов:

  1. /restaurant/:id Эндпоинт ресторана возвращает: rating — средняя оценка (1–5) numRatings — количество оценок reviews — первые 3 отзыва в свернутом виде

Этого достаточно для верхней секции страницы.

  1. /restaurant/:id/reviews Расширенный список отзывов, в том же формате, что и в summary-блоке. Используется для полной таблицы отзывов в нижней части страницы.

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

Первым делом нужно создать сущность Ratings, которая объединит вместе рейтинг, количество оценок, список отзывов (из разных источников).

Далее создадим fetch-функцию для /reviews. Например:

fetchRestaurantReviews(restaurantId: number)
typescript

Эта функция должна вызывать endpoint /restaurant/:id/reviews и возвращать сырые данные API.

И наконец создадим функцию getRatings(). Например:

export async function getRatings(id: number): Promise<Ratings>
typescript

Эта модель должна:

  • вызывать основной эндпоинт ресторана (/restaurant/:id);
  • вызывать эндпоинт /reviews;
  • нормализовать и объединить данные в формат Ratings;
  • возвращать объект, готовый к использованию в UI.

Модель должна содержать:

  • rating — число от 1 до 5
  • numRatings — количество оценок
  • reviews — список отзывов в упрощённом формате CustomerReview[]

И в итоге необходимо заиспользовать полученные данные внутри страницы ресторана.

Это платный урок

Купите полный доступ к курсу чтобы просматривать данный контент

Основы архитектуры фронтенда

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

3990 Скидка 75%
990

Безопасные платежи обрабатываются сервисом Юкасса

Комментарии

Войдите, чтобы оставить комментарий