weather-app

🌦 Weather Notification Web App

A simple and elegant weather website that shows real-time weather updates for any city and sends browser notifications using the Open‑Meteo API.

This project is built using HTML, CSS, and JavaScript and is deployed on GitHub Pages.

---

🔗 Live Demo

👉 https://USERNAME.github.io/weather-app/

---

📌 Project Description (for GitHub)

A lightweight weather web app that fetches live temperature and wind data by city name and displays browser notifications using modern JavaScript APIs.

---

✨ Features

• 🌍 Search weather by city name
• 🌡 Displays temperature in °C
• 💨 Shows wind speed (km/h)
• 🔔 Browser notification alerts
• ⚡ Fast & lightweight
• 🌐 Free Open‑Meteo API (no API key required)

---

🛠 Technologies Used

• HTML5
• CSS3
• JavaScript (ES6)
• Open‑Meteo Weather API
• Browser Notifications API
• GitHub Pages (Hosting)

---

📁 Project Structure

weather-app/
│── index.html
│── style.css
│── script.js
│── README.md

---

🚀 How to Run Locally

1. Download or clone this repository

2. Open index.html in a browser

   OR

3. Use VS Code Live Server extension

---

🌐 Deployment (GitHub Pages)

1. Push project to a GitHub repository
2. Go to Settings → Pages

3. Select:

   • Branch: main
   • Folder: /root
4. Save and wait a few seconds
5. Your site will be live 🎉

---

🔔 Notification Notes

• Notifications work only on HTTPS (GitHub Pages supported)
• User must allow notification permission
• Notifications trigger after clicking the button (browser security rule)

---

🧠 Future Improvements

• 📍 Auto-detect user location
• ⏰ Daily weather alerts
• 🌤 Weather icons & animations
• 📊 Forecast charts
• ⚙️ Backend with Node.js & Express

---

📜 License

This project is open-source and free to use for learning purposes.

---

⭐ If you like this project, give it a star on GitHub!