A modern, responsive weather forecast application built with React, Tailwind CSS, and the OpenWeatherMap API. This project delivers real-time weather updates, hourly and daily forecasts, and a user-focused experience with dynamic visuals and mobile-first design.
🔗 Live Demo: weather-app-xy.netlify.app
- 🔍 City-based Search – Enter any city name to get local weather.
- 📍 Geolocation Support – Use your current location for accurate local data.
- 🌡 Dynamic Background – Background gradients shift with temperature changes.
- ⏱ Real-Time Data – Fetches live weather from the OpenWeatherMap API.
- 📅 Hourly + Daily Forecasts – Displays 3-hour intervals and 5-day trends.
- 📱 Fully Responsive – Optimized for mobile, tablet, and desktop views.
- ✅ Accessible and SEO-friendly – Includes alt text, meta, and a11y best practices.
| Tool | Purpose |
|---|---|
| React | UI Framework |
| Tailwind CSS | Responsive Styling |
| React Icons | Iconography |
| React Toastify | Toast Notifications |
| OpenWeatherMap API | Weather Data Source |
| Geolocation API | Location-based Search |
| Metric | Score |
|---|---|
| Performance | 99+ |
| Accessibility | 100 |
| Best Practices | 100 |
| SEO | 92+ |
This project is licensed under the MIT License.
git clone https://github.com/Gideon-Cameron/react-weather-app.git
cd react-weather-app
npm install