Weather Web App

Welcome to the Weather Web App repository! This project is a modern web application that provides real-time weather updates for any location worldwide. Built with HTML, CSS, and JavaScript, it delivers an intuitive user interface and fetches live data using the OpenWeatherMap API.

🌐 Live Demo

Live Demo

✨ Features

• Live Weather Data: Get up-to-date weather information for your current location or search for any city worldwide
• 5-Day Forecast: View detailed weather predictions for the next 5 days
• Explore Section: Discover weather conditions in various cities around the world
• Add Multiple Cities: Save and track weather for your favorite locations
• Responsive Design: Seamlessly works across desktop, tablet, and mobile devices
• Real-time Updates: Refresh weather data at any time with a single click

🛠️ Technologies Used

• Frontend: HTML5, CSS3, JavaScript (ES6+)
• API: OpenWeatherMap API
• Icons: Font Awesome

📚 API Endpoints Used

• Geocoding API - To get location name (city/area) using longitude and latitude:
  https://openweathermap.org/api/geocoding-api
• Current Weather Data - To fetch current weather conditions:
  https://openweathermap.org/current
• 5 Day Forecast - To get 5-day weather forecast:
  https://openweathermap.org/forecast5

🚀 Getting Started

Follow these steps to get a local copy up and running.

Prerequisites

• A modern web browser (Chrome, Firefox, Safari, or Edge)
• An API key from OpenWeatherMap

Installation

1. Clone the repository:

   git clone https://github.com/Jeevanm2004/weather-web-app.git

2. Navigate to the project directory:

   cd weather-web-app

3. Add your API key:
   • Open the JavaScript files in the js folder
   • Replace the API key with your own:

   let apiKey = "YOUR_API_KEY_HERE";

4. Launch the application:
   • Open index.html in your browser to start using the app

Usage

1. Search for a city: Enter any city name in the search bar and press Enter
2. View current weather: See temperature, humidity, wind speed, and weather conditions
3. Check forecast: Scroll down to view the 5-day weather forecast
4. Explore cities: Navigate to the Explore section to see weather in various cities
5. Add favorites: Save your frequently checked cities for quick access

📧 Contact

For any inquiries or feedback, feel free to reach out:

• Email: jeevanm.bit@gmail.com
• LinkedIn: @jeevanabhi
• GitHub: @Jeevanm2004

📝 License

This project is open source and available under the MIT License.

🙏 Acknowledgments

• Weather data provided by OpenWeatherMap
• Icons by Font Awesome
• Inspired by modern weather application designs

---

© 2024 Jeevan M — All rights reserved