This weather application is designed to provide users with accurate and real-time weather information. Users can access current weather condition. As soon as we find a location that we want it'll show us the status give us an icon as well as our wind speed, temperature, local time and precipitation. When the user enters our website, they can indent the city they want. At the same time, a photo of the indented city is adapted to the background. With the Toggle option, allows users to switch between metric and imperial units (e.g., Celsius and Fahrenheit, and the wind speed in km/h or mph). It triggers a new fetch of weather data with the selected unit.
- The app needs to be responsive.
- The app needs to be a single page application. That means there should be only one index.html file and JavaScript needs to update the HTML using DOM manipulation.
- The app needs to interact with an API to grab data.
- The app needs to have loading/error handling for the interaction with the API and needs to show this to the user, not just a console.log.
- The app needs some user interaction such that you need to grab different data from the API. So you cannot just grab everything from the API and store it locally with one fetch.
-
Current Weather Conditions: Display real-time temperature, wind speed, and precipitation for the user's selected location.
-
Background Image: The user should see a photo of the city they type in the search bar.
-
Toggle feature: The user should be able to change the units of temperature and wind speed.
-
[-] Interactive Maps: Integrate maps for users to visualize weather patterns and explore forecasts geographically.
-
[-] Hourly and Daily Forecasts: Provide detailed forecasts for the upcoming hours and days.
-
[-] Dark Mode: Implement a visually pleasing dark mode for better user experience during low-light conditions.
I need to have some API to access in order to get both the weather information as well as the location information.
- To get the weather information I am going to use this API = (https://openweathermap.org)
For any inquiries or feedback, please contact:
[Burhan Elaldi]
[[email protected]]