🌦️ Building a Weather App with React and Css 🌦️
I'm excited to share my latest project: a Weather App built with React! This project was a great opportunity for me to dive deeper into API integration, state management, and responsive design. Here’s a breakdown of what I created.
🚀 Features
Real-Time Weather Data: Users can search for any city to get current weather conditions, including temperature, humidity, and atmospheric pressure.
Air Quality Index (AQI): The app fetches and displays air quality data, providing users with essential information about pollutants like PM2.5, SO2, NO2, and O3 levels.
Geolocation Support: The app can automatically fetch the user's current location weather data, making it convenient for users on the go.
Unit Toggle: Users can switch between Celsius and Fahrenheit with a simple button click.
Daily Forecast: A detailed daily weather forecast gives users insights into temperature fluctuations throughout the day.
Responsive Design: The app is designed to work seamlessly across devices, ensuring a smooth user experience whether on desktop or mobile.
📡 Tech Stack
Frontend: React.js
API: OpenWeatherMap for weather data and air quality data
Styling: Custom CSS for layout and design
GitHub Repository link => Weather App.
Deployed Model => Weather App
Key Functionality:
Data Fetching: The fetchWeather function makes API calls to get current weather and air quality data. I handle loading states and errors to provide feedback to users.
Dynamic Rendering:
Depending on the state (loading, error, or data fetched), the app conditionally renders different components to keep the user informed.
Top comments (4)
Nice 🙂
Very cool!
Great project! 🌦️ Are you planning to deploy this app on a server like Vercel or Netlify? It would be awesome to see it live! 😊
Check the deployed model at: Weather App
also added feature to fetch current user location to get latitude and longitude to show weather accordingly properly