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: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/teplostanski/test_task__react-ts-redux-toolkit__re-action
• Owner: teplostanski
• Created: 2024-03-02T22:25:22.000Z (10 months ago)
• Default Branch: main
• Last Pushed: 2024-08-14T14:02:27.000Z (5 months ago)
• Last Synced: 2024-10-15T02:25:48.926Z (3 months ago)
• Language: TypeScript
• Homepage: https://teplostanski.github.io/TEST_TASK__react-ts-redux-toolkit__re-action/
• Size: 190 KB
• Stars: 3
• 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...", при отсутствии элементов написать, что ничего нет)

Бонус! (не обязательно): в найденных элементах выделять красным фрагменты текста, которые введены в поле поиска