A modern weather dashboard built using React + Vite that provides real-time weather information based on city search. The application fetches live weather data using the WeatherAPI service and displays temperature, weather conditions, and location details with a responsive UI.
🔗 Live Demo: https://weather-application-delta-liard.vercel.app
This project demonstrates frontend development, API integration, and responsive UI design using modern JavaScript frameworks. Users can search for any city and view real-time weather updates.
This project showcases:
- REST API integration
- React component architecture
- asynchronous data fetching
- responsive UI development
- modern frontend tooling
✅ Search weather by city name ✅ Real-time weather data ✅ Weather condition and temperature display ✅ Responsive UI design ✅ Error handling for invalid locations ✅ Clean and modern interface
- React.js
- Vite
- JavaScript ES6
- Tailwind CSS
- REST API Integration
This project uses WeatherAPI for fetching real-time weather data.
- API Provider: https://www.weatherapi.com
- Provides temperature, location, and weather condition data
- REST-based API integration using asynchronous requests
This project was developed with assistance from AI tools for UI suggestions and development workflow guidance. All implementation and architecture decisions were done independently.
weather-application/ │ ├── public/ # Static files ├── src/ # React components and logic ├── index.html # Entry file └── package.json # Dependencies
- Clone repository:
git clone https://github.com/avinashmax/Weather-application.git
- Install dependencies:
npm install
- Run development server:
npm run dev
- React component-based architecture
- API integration using WeatherAPI
- State management and async operations
- Frontend project structure
- Modern build tools (Vite)
- 5-day weather forecast
- Geolocation-based weather
- Dark/light mode
- Unit conversion (°C / °F)
Avinash S Aspiring Cloud Engineer | Full Stack Developer | AWS & Python