Назад к задачам
Junior — Senior
12

React‑компонент для отображения и поиска пользователей

Получайте помощь с лайвкодингом в реальном времени с Sobes Copilot
Условие задачи

Создать базовый React‑компонент, который выполняет запрос к открытой API‑службе (https://jsonplaceholder.typicode.com/users) для получения списка пользователей и выводит их имена на странице. Добавить возможность поиска по имени: при вводе текста в поле ввода результаты должны обновляться мгновенно, показывая только тех пользователей, чьи имена соответствуют запросу.

Требования:

  • При монтировании компонента выполнить GET‑запрос к указанному URL и сохранить полученные данные в состоянии.
  • Вывести список имён пользователей в виде простого списка (например, <ul><li>...</li></ul>).
  • Реализовать поле ввода, которое хранит текущий поисковый запрос в состоянии.
  • Фильтровать массив пользователей в реальном времени, сравнивая введённый текст с полем name каждого пользователя (регистронезависимо).
  • При отсутствии совпадений вывести сообщение «Ничего не найдено».