Медиатека на открытом API Кинопоиска

Об этом проекте

Это простое приложение для просмотра информации о фильмах, созданное с использованием React, TypeScript и открытого API Кинопоиска.

Целью этого проекта является создание приложения для просмотра информации о фильмах, которое будет использовать React, TypeScript и открытое API Кинопоиска для получения данных о фильмах. Приложение будет иметь следующий функционал:

1. Отображение списка фильмов:
   • Приложение отображает список фильмов, получаемых с помощью API.
   • Отображает фильмы постранично по 50 фильмов на страницу с возможность менять количество фильмов на странице.
   • Для каждого фильма отображено:
     • Постер фильма (если доступен).
     • Название фильма.
     • Год выпуска.
     • Рейтинг фильма.
2. Есть возможность фильтровать список фильмов:
   • По жанру (выбор нескольких жанров)
   • По рейтингу (диапазон рейтинга).
   • По году выпуска (диапазон лет начиная с 1990).
3. Просмотр детальной информации о фильме:

• При клике на фильм из списка или результатов поиска, приложение переходит на страницу с детальной информацией об этом фильме.
• На странице фильма отображено:
  • Постер фильма (если доступен).
  • Название фильма.
  • Описание фильма.
  • Рейтинг фильма.
  • Дату выхода.
  • Список жанров.

Инструменты:

Дополнительные задания:

• Есть возможность добавления фильмов в список "избранное":
  • Отдельная страница со списком избранных фильмов.
  • Сохраняется список при перезагрузке страницы.

Ожидаемый результат:

• Рабочее многостраничное SPA приложение для просмотра информации о фильмах, удовлетворяющее всем перечисленным требованиям.

Начало работы

Чтобы запустить проект локально, необходимо выполнить следующие шаги:

Предварительные требования

• npm

npm install npm@latest -g

Установка: ручная

1. Клонировать репозиторий

git clone https://github.com/pamellix/kinopoisk-clone.git

2. Перейдите в папку с приложением и установите NPM пакеты

npm install

3. Запустить приложение

npm start

Чтобы собрать build версию приложения, необходимо выполнить следующие команды:

1. Установить NPM пакеты

npm install

2. Собрать build версию

npm run build

3. Запустить приложение

npx serve -d build

Установка: с помощью docker compose

1. Клонировать репозиторий

git clone https://github.com/pamellix/kinopoisk-clone.git

2. Перейдите в папку с приложением и пропишите следующую команду

docker compose up --build

Лицензия

Проект распространяется под лицензией MIT. Подробнее о лицензии можно узнать здесь: LICENSE.txt