https://github.com/shakebshamsi/weather-app

🌦️ A modern weather app using HTML, CSS, and JavaScript that fetches real-time weather data from the OpenWeatherMap API. Features a responsive design with a sleek dark UI and glassmorphism effects.
https://github.com/shakebshamsi/weather-app

async-await css3 dom-manipulation error-handling html5 javascript openweather-api responsive-design restful-api-integration

Last synced: 9 days ago
JSON representation

🌦️ A modern weather app using HTML, CSS, and JavaScript that fetches real-time weather data from the OpenWeatherMap API. Features a responsive design with a sleek dark UI and glassmorphism effects.

• Host: GitHub
• URL: https://github.com/shakebshamsi/weather-app
• Owner: ShakebShamsi
• Created: 2025-05-07T08:18:48.000Z (9 days ago)
• Default Branch: main
• Last Pushed: 2025-05-07T08:28:19.000Z (9 days ago)
• Last Synced: 2025-05-07T23:13:26.386Z (9 days ago)
• Topics: async-await, css3, dom-manipulation, error-handling, html5, javascript, openweather-api, responsive-design, restful-api-integration
• Language: JavaScript
• Homepage: https://shakebshamsi.github.io/weather-app/
• Size: 7.81 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# 🌦️ Weather App

A sleek and modern weather application built with **HTML**, **CSS**, and **JavaScript**. This app fetches real-time weather data using the **OpenWeatherMap API**, featuring a responsive design and stylish dark theme with glassmorphism UI effects.

---

## 🚀 Features

- 🔍 Search weather by city name

- 🌡️ Displays temperature and description

- 💡 Beautiful dark UI with animated buttons and gradients

- ❗ Error handling for invalid city names

- 📱 Fully responsive for mobile and desktop

---

## 🛠️ Technologies Used

- HTML5

- CSS3 (Glassmorphism + Gradient + Responsive Design)

- JavaScript (ES6+)

- [OpenWeatherMap API](https://openweathermap.org/api)

---

## 📦 Setup Instructions

1. **Clone the Repository**

   ```bash

   https://github.com/ShakebShamsi/weather-app.git

📁 Project Structure

bash

Copy

Edit

weather-app/

│

├── index.html          # Main HTML file

├── styles.css          # All styling (dark theme, responsiveness)

├── script.js           # Main logic for fetching & displaying weather

└── README.md           # Project overview and setup

🧠 Author

Shakeb Hassan Shamsi