shreyhere/react-image-fetcher---working-with-apis-react-react-authentication-creating-a---x7epzcw6z3fw

React photo fetcher.

The API https://jsonplaceholder.typicode.com/photos/${id} where id is number between 1-5000, returns an object of this structure {
 albumId: 1,
 id: 5,
 title: "natus nisi omnis corporis facere molestiae rerum in",
 url: "https://via.placeholder.com/600/f66b97",
 thumbnailUrl: "https://via.placeholder.com/150/f66b97"
}

On initial load of application, only an input box which takes only numbers is visible. When someone enters a number, it makes a GET request to the above mentioned api with that number. While request is resolving, it shows the Loader component which is predefined.

After data has been fetched, display the PhotoFrame component. The PhotoFrame component takes 2 props, url and title. The component returns a div with class="photoframe", inside that using display an img with using url prop as src. Also display the title inside div with class="caption".

This repeats further whenever someone changes the number in input.