Skip to content

Weather App is a dynamic and user-friendly web application designed to provide real-time weather information, including temperature, humidity, wind speed, and more. Utilizing the OpenWeatherMap API, this app allows users to search for weather details by city and supports both metric (Celsius) and imperial (Fahrenheit) units to cater to a global aud

Notifications You must be signed in to change notification settings

KDvs123/Weather-App

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 

Repository files navigation

🌤️ Weather App 🌤️

HTML5 CSS3 JavaScript Font Awesome OpenWeatherMap API License: MIT

Weather App is a dynamic and user-friendly web application designed to provide real-time weather information, including temperature, humidity, wind speed, and more. Utilizing the OpenWeatherMap API, this app allows users to search for weather details by city and supports both metric (Celsius) and imperial (Fahrenheit) units to cater to a global audience.

✨ Features

  • 🔍 City Search: Easily search for any city to get current weather information.
  • 🌡️ Temperature Units: Switch between Celsius (°C) and Fahrenheit (°F) units.
  • 🌦️ Weather Details: View detailed weather information, including real feel, humidity, wind speed, and atmospheric pressure.
  • 📱 Responsive Design: Crafted to provide an optimal viewing experience across a wide range of devices.

🎥 Demo Video

Watch the demo video to see the Weather App in action:

🖼️ Screenshots

Weather App in action

Screenshot 2024-06-03 191453

Screenshot 2024-06-03 191516

Screenshot 2024-06-03 191543

Farenheight Convertion

Screenshot 2024-06-03 191603

🛠️ Tech Stack

  • Frontend: HTML5
  • Styling: CSS3
  • Scripting: JavaScript
  • Icons: Font Awesome
  • API: OpenWeatherMap

🚀 Getting Started

📋 Prerequisites

Make sure you have the following installed on your local machine:

  • A modern web browser capable of running HTML5, CSS3, and JavaScript.
  • An API key from OpenWeatherMap.

🔧 Installation

  1. Clone the repository:

    git clone https://github.com/KDvs123/weather-app.git
    cd weather-app
  2. Setup API Key:

    • Open app.js and replace "your_api_key" with your actual OpenWeatherMap API key:
      const API_KEY = "your_api_key";
  3. Run the application:

    • Open index.html in your web browser to run the app.

📝 Usage

  1. Search for a city: Enter a city name in the search box and press enter or click the magnifying glass icon.
  2. View Weather Information: The app will display current weather information for the specified city.
  3. Toggle Temperature Units: Click on the °C or °F buttons to toggle between Celsius and Fahrenheit units.

📂 Project Structure

weather-app/
│
├── index.html
├── style.css
└── app.js

🤝 Contributing

Contributions are welcome! Please follow these steps to contribute:

  1. Fork the repository.
  2. Create a new branch (git checkout -b feature-branch).
  3. Make your changes.
  4. Commit your changes (git commit -m 'Add new feature').
  5. Push to the branch (git push origin feature-branch).
  6. Open a Pull Request.

📜 License

This project is licensed under the MIT License - see the LICENSE file for details.

📬 Contact

For any questions or suggestions, feel free to reach out:


Enjoy using the Weather App! 🌤️😊

About

Weather App is a dynamic and user-friendly web application designed to provide real-time weather information, including temperature, humidity, wind speed, and more. Utilizing the OpenWeatherMap API, this app allows users to search for weather details by city and supports both metric (Celsius) and imperial (Fahrenheit) units to cater to a global aud

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published