https://github.com/rushi-unge/weatherapp

🌦️ A modern and responsive Weather App built with React, Vite, Tailwind CSS, and OpenWeatherMap API. Search any city to view real-time weather data including temperature, humidity, wind, and more.
https://github.com/rushi-unge/weatherapp

apifetch reactjs tailwindcss weatherapi

Last synced: about 1 month ago
JSON representation

🌦️ A modern and responsive Weather App built with React, Vite, Tailwind CSS, and OpenWeatherMap API. Search any city to view real-time weather data including temperature, humidity, wind, and more.

• Host: GitHub
• URL: https://github.com/rushi-unge/weatherapp
• Owner: Rushi-Unge
• Created: 2025-07-09T19:23:40.000Z (11 months ago)
• Default Branch: main
• Last Pushed: 2025-07-09T19:48:06.000Z (11 months ago)
• Last Synced: 2025-07-10T04:57:39.840Z (11 months ago)
• Topics: apifetch, reactjs, tailwindcss, weatherapi
• Language: JavaScript
• Homepage: https://weather-app-1react.vercel.app/
• Size: 280 KB
• Stars: 0
• Watchers: 0
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# 🌦️ Weather App

A sleek, fully responsive Weather App built using **React + Vite**, styled with **Tailwind CSS**, and powered by the **OpenWeatherMap API**. Users can search for any city to view real-time weather details, including temperature, conditions, wind, humidity, visibility, sunrise, sunset, and more.

---

# Live Link

https://weather-app-1react.vercel.app/

## 📸 Preview

![Weather App Preview](./public/Screenshot.png)

---

## 🚀 Features

- 🔍 **Search by city name**

- 🌡️ **Current temperature** (with toggle between °C and °F)

- 🌤️ **Weather description** and dynamic icon

- 💧 **Humidity**, 🌬️ **Wind speed**, 🔆 **Pressure**, 👁️ **Visibility**

- 🌅 **Sunrise and Sunset** local times

- 📆 **7-day forecast** (UI placeholder)

- 🕓 **Hourly forecast** (UI placeholder)

- 📱 **Fully responsive** layout

- 🎨 **Modern UI** with TailwindCSS and gradient backgrounds

---

## 🛠️ Tech Stack

| Tech           | Description                              |

|----------------|------------------------------------------|

| React + Vite   | Fast frontend development                |

| Tailwind CSS   | Utility-first CSS for styling            |

| OpenWeatherMap | Free weather API                         |

---

## 📦 Installation & Setup

### 1. Clone the Repository

```bash

git clone https://github.com/your-username/weather-app.git

cd weather-app