API Data Fetching and Display

Objective

Create a webpage that fetches and displays data from a public API.

Requirements

1. Use the Fetch API or Axios to retrieve data from a public API (e.g., JSONPlaceholder).
2. Display the fetched data in a structured format on the webpage.
3. Implement error handling and a loading state.

Steps

1. Set up your HTML file with a container for the data and a loading indicator.
2. Write a JavaScript function to fetch data from the chosen API.
3. Create functions to render the data on the page.
4. Implement error handling to display user-friendly messages if the fetch fails.
5. Add a loading state that displays while the data is being fetched.

Bonus

• Implement pagination or infinite scrolling if the API supports it.
• Add a search or filter functionality for the displayed data.

Resources

• Fetch AP
• JSONPlaceholder
• Axios Documentation