Skip to content

NilanshuBasnet/WeatherApp

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

7 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Weather App ☀️🌧️❄️

A simple and elegant weather application that provides real-time weather updates based on the city name entered by the user. Built using HTML, CSS, and JavaScript, this app fetches weather data from the OpenWeatherMap API and displays weather conditions along with relevant icons and backgrounds.

🌟 Features

  • 🌍 Search weather conditions for any city worldwide.
  • 📡 Fetches real-time weather data from the OpenWeatherMap API.
  • 🌡️ Displays temperature, weather description, and location.
  • 🎨 Dynamic weather icons based on weather conditions.
  • 🎯 Keyboard support (Press Enter to search).
  • 🔥 Stylish UI with a glassmorphism effect.
  • ⚡ Error handling for invalid city searches.

🛠️ Technologies Used

  • HTML - Structuring the application.
  • CSS - Styling the UI with glassmorphism effects.
  • JavaScript - Fetching data from the API and updating the DOM.
  • OpenWeatherMap API - Retrieving live weather details.

🚀 Getting Started

📥 Installation

  1. Clone the repository:

    git clone https://github.com/NilanshuBasnet/WeatherApp.git
  2. Navigate to the project directory:

    cd weather_app
  3. Open the index.html file in your browser.

🔑 API Key Configuration

  • This project uses OpenWeatherMap API. To make it work, you need an API key.
  • Replace API_KEY in script.js with your own API key from OpenWeatherMap.

📸 Screenshots

Search Page Weather Display
Search City Weather Info

Note: The images used in this project are linked from Pixabay

About

A simple and elegant weather application that provides real-time weather updates based on the city name entered by the user.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors