🌦️ Weather React App

A high-performance, visually stunning weather application built with React and Tailwind CSS. This app provides real-time weather data with a dynamic interface that adapts its aesthetic based on the current temperature.

✨ Features

• Real-time Data: Fetches live weather updates from OpenWeatherMap API.
• Dynamic Backgrounds: UI colors shift based on temperature (Hot, Warm, Cool, Cold).
• Glassmorphism UI: Modern design using backdrop blurs and subtle borders.
• Detailed Metrics: View humidity, wind speed, "feels like" temp, and pressure.
• Fully Responsive: Optimized for both desktop and mobile screens.

🚀 Tech Stack

• Frontend: React.js
• Styling: Tailwind CSS
• HTTP Client: Axios
• API: OpenWeatherMap

🛠️ Setup Instructions

1. Clone the repo

   git clone [https://github.com/sutharsonmoorthy/Weather-react-app.git]
   

2. Install dependencies

   npm install

3. Environment Variable

   REACT_APP_OPENWEATHER_API_KEY=your_api_key_here

4. Start the app

   npm start

📂 Components

Searchbar.jsx: Handles user input and city search.

Weather.jsx: Main logic, API calls, and dynamic theme switching.

WeatherCard.jsx: Displays temperature, icons, and weather details.

🌡️ Temperature Theme Logic

30°C: Orange/Red (Hot)

20°C: Emerald/Teal (Warm)

10°C: Blue/Slate (Cool)

< 10°C: Slate/Black (Cold)

🌟 Support & Feedback

If you like this project, feel free to give it a ⭐ on GitHub!