RomanKeretsman / goit-react-hw-04-movies

Home Page:https://free-movie-finder.netlify.app/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Критерии приема

  • Создан репозиторий goit-react-hw-04-movies
  • При сдаче домашней работы есть ссылки: на исходные файлы и рабочие страницы каждого проекта на Netlify
  • В состоянии компонентов хранится минимально необходимый набор данных, остальное вычисляется
  • При запуске кода задания, в консоли нету ошибок и предупреждений
  • Для каждого компонента есть отдельная папка с файлом React-компонента и файлом стилей
  • Для компонентов описаны propTypes, и где необходимо, defaultProps
  • Все что компонент ожидает в виде пропов, передается ему при вызове
  • Имена компонентов понятные, описательные
  • JS-код чистый и понятный, используется Prettier
  • Стилизация делается только SASS, CSS-модулями или Styled Components. Можно использовать библиотеки компонентов.

Задание «Кинопоиск»

Создай базовую маршрутизацию для приложения поиска и хранения фильмов. Превью рабочего приложения смотри по ссылке.

API themoviedb.org

Для бекенда используй themoviedb.org API. Необходимо зарегистриваться (можно ввести произвольные данные) и получить API-ключ. В этой работе будут использоваться следующие ендпоинты.

Ссылка на документацию

Маршруты

В приложении должны быть следующие маршруты. Если пользователь зашел по несуществующему маршруту, его необходимо перенаправлять на домашнюю страницу.

  • '/' - компонент <HomePage>, домашняя страница со списком популярных кинофильмов.
  • '/movies' - компонент <MoviesPage>, страница поиска фильмов по ключевому слову.
  • '/movies/:movieId' - компонент <MovieDetailsPage>, страница с детальной информацией о кинофильме.
  • /movies/:movieId/cast - компонент <Cast>, информация о актерском составе. Рендерится на странице <MovieDetailsPage>.
  • /movies/:movieId/reviews - компонент <Reviews>, информация об обзорах. Рендерится на странице <MovieDetailsPage>.

Code Splitting (разделение кода)

Добавь асинхронную загрузку JS-кода для маршрутов приложения используя React.lazy() и Suspense.

About

https://free-movie-finder.netlify.app/


Languages

Language:JavaScript 70.6%Language:SCSS 28.0%Language:HTML 1.4%