https://github.com/teplostanski/test_task__react-ts-redux-toolkit__re-action
https://github.com/teplostanski/test_task__react-ts-redux-toolkit__re-action
Last synced: 11 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/teplostanski/test_task__react-ts-redux-toolkit__re-action
- Owner: teplostanski
- Archived: true
- Created: 2024-03-02T22:25:22.000Z (over 2 years ago)
- Default Branch: main
- Last Pushed: 2024-08-14T14:02:27.000Z (almost 2 years ago)
- Last Synced: 2025-02-23T05:12:28.381Z (over 1 year ago)
- Language: TypeScript
- Homepage: https://teplostanski.github.io/TEST_TASK__react-ts-redux-toolkit__re-action/
- Size: 190 KB
- Stars: 5
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# [Демо](https://teplostanski.github.io/TEST_TASK__react-ts-redux-toolkit__re-action/)
Тестовое задание Frontend разработчик
Создать одностраничное приложение, которое запрашивает у API список элементов.
Необходимые элементы страницы:
- список элементов (выводить по 10 элементов на страницу)
- элемент должен содержать id, заголовок и контент
- пагинация с возможностью переходить между страницами
- поиск - инпут с кнопкой для фильтрации запроса
Можно использовать любую API, которая поддерживает пагинацию и фильтр, например jsonplaceholder.typicode.com
Использовать стек: TypeScript, React, Redux toolkit, Axios.
Стили на ваше усмотрение. Адаптив не обязателен.
Требования:
- список элементов, номер страницы и состояние запроса должны храниться в Redux
- запросы выполнять через Redux AsyncThunk с последующим обновлением состояния
- информировать пользователя о состоянии запроса (при загрузке показать "Loading...", при отсутствии элементов написать, что ничего нет)
Бонус! (не обязательно): в найденных элементах выделять красным фрагменты текста, которые введены в поле поиска