Weather App is a responsive and modern web application that allows users to check the current weather and forecast for any city around the world. The app fetches real-time weather data from a weather API and displays it in an easy-to-read and visually appealing format. The application also provides various additional features such as hourly forecasts, weekly weather data, and dynamic weather-based backgrounds.
- ๐ค๏ธ View Current Weather: Displays real-time weather data for any city.
- ๐ View Hourly Weather: Plan your day with an hourly forecast.
- ๐ View Weekly Forecast: View a 7-day weather forecast for the selected city.
- ๐ก๏ธ Detailed Weather Information: Get temperature, humidity, wind speed, and more.
- ๐ Weather Data Caching: The app supports offline mode, so you can access weather info even without internet.
- ๐ Localization: Choose your preferred language.
- ๐งฎ Metric or Imperial Units: Customize the temperature and wind speed units.
- ๐ Celsius/Fahrenheit Toggle: Switch between Celsius and Fahrenheit.
- โฐ 12/24 Hour Time Formats: Adjust the time display based on your preference.
- ๐ Dynamic Backgrounds: The background image changes based on the current weather.
- ๐ Weather Icons: Icons change based on the weather (e.g., sun, clouds, rain).
Here are two screenshots of the Weather App:
- Frontend:
- HTML5, CSS3, JavaScript
- API: OpenWeatherMap API (or any other weather API)
- Framework: None (Vanilla JS)
- Design:
- Responsive design using Flexbox and CSS Grid
- Modern UI with weather-specific icons and backgrounds
- You need Node.js installed on your machine.
- You'll need a weather API key from OpenWeatherMap or another weather service.
- Clone the repository:
git clone https://github.com/Guten-Morgen1302/weather-app.git
Navigate to the project directory:
cd weather-app
Install the required dependencies (if any):
npm install
Add your API key to the project:
Open the script.js (or wherever the API key is used).
Replace the placeholder with your API key.
Open the index.html file in a web browser, or start a local server to run the project:
If youโre using VS Code, you can use the Live Server extension to launch it locally.
View the app in your browser at http://localhost:3000 (or the default port).
๐ค Contributing
Feel free to fork this repository and submit pull requests for improvements or additional features. If you have any issues or suggestions, feel free to open an issue in the repository.
๐ License
This project is licensed under the MIT License - see the LICENSE file for details.
๐ Acknowledgments
Thanks to OpenWeatherMap for providing the weather API.
Inspiration from various weather apps for the design and functionality.
