Fetch Users Demo

A simple web application that uses the JavaScript Fetch API to retrieve user data from a public API and display it on the webpage.
Includes error handling, modern UI styling, navigation bar, footer, and a reload button.

---

🚀 Features

• Fetches user data from: https://jsonplaceholder.typicode.com/users
• Displays:
  • Name
  • Email
  • Address
• Modern UI using HTML + CSS
• Error handling with try/catch
• Reload button to refetch data
• Responsive card layout
• Navigation bar and footer included
• Network error testing supported (DevTools → Offline mode)

---

📁 Project Structure

project-folder/ │── index.html │── app.js │── README.md

---

🔧 Technologies Used

• HTML5
• CSS3
• JavaScript (Fetch API)
• JSONPlaceholder API
• Chrome Browser / VS Code

---

📌 Getting Started

1. Clone or Download the Project

git clone https://github.com/mdshanansari786786-coder/-Fetch-and-Display-Data-from-a-Public-API-Using-Fetch-API

2. Open the Project

Open the folder in VS Code.

3. Run the App

Just open index.html in your browser:

• Right-click index.html
• Select Open with Live Server (or open normally)

You should see the styled user dashboard.

---

🔁 Reload Button

Click the Reload Users button to fetch fresh data anytime.

---

🧪 Testing Error Handling

1. Open Chrome DevTools
2. Go to the Network tab
3. Change dropdown to Offline
4. Click Reload Users
   ➡ You will see an error message on screen.

---

🌐 API Used

Data is fetched from the free public REST API:

https://jsonplaceholder.typicode.com/users

---

📝 License

This project is open-source and free to use.

---

🙌 Author

Md Shan Ansari Feel free to improve and extend this project!