Weather App

Short Description

In this project, I have developed a browser-based weather interface that displays real-time weather and a 5-day forecast using OpenWeatherMap data. The interface is built with vanilla JavaScript; features like geolocation, recent searches, and a dynamic background all operate directly on the client-side. :contentReference[oaicite:0]{index=0}

Problem

Most basic weather applications often only display the temperature and have a weak user flow. In this project, I focused on solving the need to consolidate search functionality, using current location, additional weather metrics, and short-term forecasts into a single screen. :contentReference[oaicite:1]{index=1}

Solution

I make OpenWeatherMap API calls based on city name or coordinates and display information such as temperature, feels-like temperature, wind, humidity, pressure, and visibility. I change the background gradient according to the weather, generate icons with Lucide, and animate transitions with GSAP. I've also stored recently searched cities in localStorage to make them accessible again. :contentReference[oaicite:2]{index=2}

Result

The outcome is a visually more organized and interactive weather application that can be opened directly in the browser without any installation required. While the project is small-scale, it clearly demonstrates API integration, browser features, and interface state management within a single file structure. :contentReference[oaicite:3]{index=3}

Technologies

HTML5, CSS3, JavaScript, OpenWeatherMap API, GSAP, Lucide Icons, localStorage, Geolocation API

Setup