This project is a simple weather forecasting web application that provides current weather information and a 3-day forecast for a given location. The web app has a visually appealing interface with background images changing based on the weather conditions. It is designed to be responsive, making it accessible on various devices.
- Current Weather Display: The application displays the current weather conditions, including temperature, weather description, and an icon representing the weather.
- Location Search: Users can search for the weather in different locations by entering the city or country name in the search bar.
- 3-Day Forecast: The app provides a 3-day weather forecast, including the day's name, weather icon, and temperature.
- Responsive Design: The web app is designed to work seamlessly on different screen sizes, ensuring a consistent user experience.
- HTML: The structure of the web page.
- CSS: Styling for the visual elements and responsiveness.
- JavaScript: Dynamic content, API integration, and user interactions.
- OpenWeatherMap API: Used to fetch real-time weather data for the specified location.
The project is deployed using GitHub Pages and can be accessed at Weather Forecast Web App.
- User Input: Users can enter a city or country name in the search bar.
- API Integration: The application makes a request to the OpenWeatherMap API to retrieve current weather data and forecast information based on the user's input.
- Dynamic Content: The fetched data is dynamically displayed on the web page, including the current weather, background image, and the 3-day forecast.
- Background Color Change: The background color of the page changes dynamically based on the main weather condition (clear, clouds, rain, etc.).
- Responsive Design: The web app is designed to adapt to different screen sizes, providing a user-friendly experience on both desktop and mobile devices.
The deployment process involves hosting the static web files on GitHub Pages. This allows users to access the web app through a URL without the need for a dedicated server. The GitHub Pages link for this project is provided above.
Feel free to explore the Weather Forecast Web App and check the weather in different locations! ☀️🌧️🌨️