A simple weather forecast web application built using HTML, CSS, and JavaScript.
It allows users to search for any city and get real-time weather data including temperature, weather condition, humidity, wind speed, sunrise and sunset times.
- 🔎 Search current weather by city name
- 🌡️ Display weather icon, temperature, and description
- 🌅 Show sunrise and sunset time
- 💧 Show humidity and wind speed
- 🌐 Real-time data fetched from OpenWeatherMap API
- 📱 Responsive layout with clean UI
- HTML5, CSS3
- JavaScript (Vanilla JS)
- Moment.js for time formatting
- Font Awesome for search icon
- OpenWeatherMap API for weather data
Endpoint format: https://api.openweathermap.org/data/2.5/weather?q={city name}&appid={YOUR_API_KEY}&units=metric&lang=en
You’ll need to register at OpenWeatherMap to get a free APP_ID.
-
Clone this repository:
git clone https://github.com/your-username/weather-app.git -
Navigate into the project folder:
cd weather-app -
Open js/index.js and replace the APP_ID variable with your own API key:
const APP_ID = 'your_api_key_here';
🖼️ Demo
Replace the image above with a screenshot or GIF of your app in action.