Основная задача тестового не узнать как сильно вы знаете React, а посмотреть насколько хорошо вы сможете разобраться с новыми технологиями в относительно короткий срок. В идеале, на него нужно потратить не более 3 дней. А так - делайте сколько делается, пока мы не закроем вакансию ;)
Нужно написать одностраничное приложения для просмотра фильмов с помощью The Movie Database API.
При открытии приложения, должен отображаться список популярных фильмов с пагинацией или динамической подгрузкой (на выбор). Также на странице должно быть поле для поиска. Когда ты вводишь туда какой-то текст, должны отобразиться фильмы которые ему соответствуют. Для каждого фильма в списке должен отображаться список жанров (названий жанров, не айдишек), к которым он принадлежит.
При клике на карточку с фильмом, должна быть показана страница с детальной информацией об этом фильме и списком рекоммендованых или похожих (можно и то, и то) фильмов к нему.
Также реализуйте возможность добавлять фильмы в избранное как со списка, так и на странице с отдельным фильмом. Список таких фильмов сохраняйте локально (localStorage, например). Предусмотрите просмотр списка с избранными фильмами где-то в приложении и удаление из избранного. Также предусмотрите отображение на карточке с фильмом и его странице информации о том, что этот фильм добавлен в избранное.
- Вы можете использовать готовые компоненты и/или утилиты. Например, компонент для ленивой подгрузки или утилиту для синхронизации с localStorage. Еще, есть готовые библиотеки компонентов, которые помогут ускорить разработку.
- Внешний вид приложения тоже оценивается. Попробуйте продумать интерфейс пользователя и его взаимодействие с приложением / UX
- По желанию, можете покрыть код необходимым набором тестов
- Используйте современный JavaScript
- Добавьте к решению инструкции по запуску проекта и краткое описание решения
- Выложите куда-то рабочее приложение, например, на GitHub Pages или Heroku
- По технологиям – на свое усмотрение, из обязательного только React.
Ссылки с документацией к API:
- https://developers.themoviedb.org/3
- https://developers.themoviedb.org/3/movies/get-popular-movies
- https://developers.themoviedb.org/3/search/search-movies
- https://developers.themoviedb.org/3/genres
- https://developers.themoviedb.org/3/movies/get-movie-details
- https://developers.themoviedb.org/3/movies/get-movie-recommendations
Можно почитать / посмотреть:
- React Video Course on egghead
- React Video Course on reacttraining
- Redux Video Course Part 1
- Redux Video Course Part 2
- Вебинар по ФП
- Документация Redux (рекомендую читать прям как книгу)
- Документация React (аналогично)
- Normalizr
- ImmutableJS
- ImmutableJS - хороший доклад
- ES2015
- Куча полезностей по Redux
- Хорошая статья про react-router
- Пример: Sound Redux
- Пример: Асинхронные запросы в Redux
- Пример: Пример с роутингом и редаксом
P.S. Прошу не копипастить из примеров, я это замечу :) Используйте их для вдохновения и рефереренса.
Ох и бред