Skip to content

AkshayTiwari27/weather-webapp

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

3 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Weather Web Application

Description

The Weather Web Application is a responsive tool that allows users to view real-time weather updates for any location worldwide. By integrating with the OpenWeatherMap API, the app fetches accurate weather data and presents it in a clean and intuitive interface. This application provides essential weather information like temperature, humidity, wind speed, and overall weather conditions in any city of the user’s choice.

Technologies Used

  • JavaScript: Handles API requests and manages the dynamic update of weather data on the page.
  • HTML: Structures the layout of the weather app, including the search bar and weather display areas.
  • CSS: Styles the UI to ensure a clean, responsive, and user-friendly design across different devices.
  • OpenWeatherMap API: Provides real-time weather data for various locations globally.

Features

1. Real-Time Weather Data

The application uses the OpenWeatherMap API to fetch up-to-date weather data, including:

  • Temperature (in Celsius or Fahrenheit).
  • Humidity (percentage).
  • Wind speed (in meters per second or miles per hour).
  • Weather conditions (clear, cloudy, rain, etc.).

2. Search Functionality

Users can search for any city across the globe, and the app will display the current weather conditions for that location.

3. Responsive Design

The weather app is fully responsive, ensuring that the layout adjusts properly on various screen sizes, including mobile, tablet, and desktop devices.

4. User-friendly Interface

The app offers a clean and simple design, making it easy for users to enter a location and view the weather data quickly.

5. Mobile-Friendly Experience

Built with responsiveness in mind, the app ensures a seamless experience on mobile devices, so users can check the weather while on the go.

How to Use

  1. Open the App: Launch the weather app in any browser.
  2. Search for a Location: Enter a city name into the search bar and press enter.
  3. View Weather Data: The app will display the current temperature, humidity, wind speed, and weather conditions for the searched city.
  4. Switch Cities: Use the search bar to look up weather information for any other location worldwide.

Installation and Setup

To set up this application locally, follow the steps below:

  1. Clone the repository:

    git clone https://github.com/your-repo/weather-webapp.git
  2. Navigate to the project directory:

    cd weather-webapp
  3. Open the index.html file in your browser to run the application.

  4. API Key Configuration:

    • Sign up at OpenWeatherMap and get your API key.
    • Open the JavaScript file where the API call is made and replace the placeholder with your actual API key.
    const apiKey = 'YOUR_API_KEY';

Potential Future Enhancements

  • Add forecast functionality to display weather for the upcoming days.
  • Include geolocation support to automatically fetch weather data for the user’s current location.
  • Provide options for users to switch between Celsius and Fahrenheit.
  • Display additional weather details, such as sunrise and sunset times.

This Weather Web Application provides an efficient and responsive way to stay updated with real-time weather information for any location in the world. Whether you're planning a trip or just curious about the weather in a different city, this app makes it easy to find the information you need.s

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published