Junior — Senior
Interactive search for characters from Rick and Morty
livecode
Task condition
The task involves creating a small React application that allows searching for characters via the public API https://rickandmortyapi.com. Requirements for implementation:
- The page should have a single text input field where the user enters a query. As the user types, a request should be sent to the API, and results should be received.
- After receiving the response from the server, display a list of found entities, showing only their
name. - Add a loading indicator that is visible while the request is in progress.
- Properly handle situations where the API returns an error (e.g., network failure or no matches).
import React from 'react';
function getPeople(name, page = 1, options = {}) {
return fetch(
`https://rickandmortyapi.com/api/character?name=${name}&page=${page}`,
options
).then((res) => res.json());
}
export default function App() {
return '20 minutes adventure!';
}
As a starting point, you can use the provided getPeople function for making requests and the App component as a template, which needs to be refined according to the specified requirements.