A responsive weather application built using HTML, CSS, and JavaScript with Weather API integration.
This project provides real-time weather information for different cities using API requests and dynamic UI updates.
- Real-time weather updates
- Search weather by city name
- Temperature display
- Humidity information
- Wind speed details
- Weather condition icons
- Responsive user interface
- API integration
- Dynamic data fetching
- HTML5
- CSS3
- JavaScript
- OpenWeather API / Weather API
weather-app/
│
├── index.html
├── style.css
├── script.js
├── assets/
└── README.mdgit clone https://github.com/your-username/weather-app.gitcd weather-appSimply open the index.html file in your browser.
Or use Live Server in VS Code.
Get your API key from:
- OpenWeatherMap API
Add your API key inside script.js
const apiKey = "YOUR_API_KEY";- User enters a city name.
- JavaScript sends API request.
- Weather data is fetched dynamically.
- Weather information is displayed on the UI.
- API fetching using Fetch API
- Dynamic DOM manipulation
- Real-time weather updates
- Responsive design
- Error handling for invalid cities
Add your screenshots here.
screenshots/home.png
screenshots/weather-result.png- 7-day weather forecast
- Geolocation support
- Dark mode
- Weather animations
- Hourly forecast
- Multiple city tracking
Through this project, I learned:
- API integration
- Fetch API usage
- JavaScript DOM manipulation
- Asynchronous programming
- Responsive web design
- Error handling
- Dynamic UI updates
Contributions are welcome.
- Fork the repository
- Create a new branch
- Commit changes
- Push the branch
- Open a Pull Request
This project is licensed under the MIT License.
Anchal Maurya
Frontend Developer 🚀