Необходимо используя Github Search API создать React приложение, которое состоит из двух страниц:
Карточка репозитория – страница с детальной информацией по репозиторию Главная страница Ключевые элементы страницы:
- Поле для поиска репозиториев
- Список репозиториев
- Paginatе – список страниц
При введении текста в Поле для поиска, должен происходить поиск по названию среди всех репозиториев Github и выводиться его результат в Список репозиториев ниже. Если в поле пустое, то показывается список репозиториев текущего пользователя. Примерная структура элементов списка: Название репозитория - количество звёзд на github - дата последнего коммита - ссылка на Github Внизу страницы есть Paginate вида [1, 2, 3, 4, 5]. Не показывать больше 10 страниц. Выбранная страница в Paginate должна отличаться по стилю от всех остальных. При перезагрузке страницы состояние выбранных фильтров (поиска и страницы) должно сохраняться и использоваться для первоначального запроса. Поиск должен происходить на стороне API. При клике на название репозитория происходит переход на Карточку репозитория.
Карточка должна иметь следующую структуру:
- Название репозитория - кол-во звёзд на github - дата последнего коммита
- Фото владельца репозитория, если есть - Nickname владельца репозитория с ссылкой на него
- Список используемых языков в репозитории
- Краткое описание репозитория
Плюсом будет, если вы покроете end-to-end тестами функционал приложения можно использовать Playwright или Cypress.
- Основные технологии - (Vite/Webpack), Typescript, React
- Использовать стейт-менеджер: Redux(toolkit / Rtk query). Данные должны храниться в стейт-менеджере.
- UI библиотеки использовать нельзя, все нужно сверстать самостоятельно
- Структура приложения должна быть с расчетом на будущий рост
В остальном выбирайте любые инструменты для выполнения задания. Главное, чтобы вашим приложением можно было пользоваться в рамках описанных сценариев. Желательно сделать адаптивную верстку.