Weather App 🌦️

A responsive and user-friendly Weather Application built using HTML, CSS, and JavaScript, powered by the OpenWeatherMap API. This app allows users to search for any city worldwide and get real-time weather information instantly.

Live Preview: GitHub : [(https://sakibdeveloper999.github.io/Weather-App/)]

---

Features:

• Search weather by city name
• Displays temperature in Celsius
• Shows humidity level
• Shows wind speed
• Dynamic weather icons based on conditions
• Error handling for invalid city names
• Fully responsive for mobile, tablet, and desktop
• Loads a default city on startup

---

Technologies Used:

• HTML5 – Structure
• CSS3 – Styling & Responsive Design
• JavaScript (ES6) – Functionality & API handling
• OpenWeatherMap API – Weather data source
• Google Fonts – Typography

---

Project Structure:

Weather-App/

• index.html

• style.css

• script.js

• Images/

  • clear.png
  • clouds.png
  • drizzle.png
  • humidity.png
  • mist.png
  • rain.png
  • snow.png
  • windsd.png
  • search.png

• README.md

---

How It Works:

1. User enters a city name in the search box

2. App fetches real-time weather data using OpenWeatherMap API

3. Weather details are displayed dynamically:

   • Temperature
   • Humidity
   • Wind speed
   • Weather icon

4. If the city is invalid, an error message is shown

---

API Configuration:

• This app uses the OpenWeatherMap API.

• To use your own API key:

  1. Visit https://openweathermap.org/api
  2. Create a free account
  3. Generate an API key
  4. Replace the existing key in script.js

Note: For production apps, do not expose API keys in frontend code.

---

Responsive Design:

• Fully responsive and optimized for mobile devices, tablets, and desktop screens.
• Media queries ensure smooth layout adjustments across screen sizes.

---

Future Improvements:

• Auto-detect user location
• 5-day weather forecast
• Light/Dark mode toggle
• Temperature unit toggle (°C / °F)
• Save recent searches using LocalStorage
• Weather animations

---

Author:

Sakib Developer Linktree: https://linktr.ee/sakibdeveloper GitHub: https://github.com/sakibdeveloper999

---

License:

• This project is licensed under the MIT License.
• You are free to use, modify, and distribute this project.

If you like this project, don’t forget to star the repository!