Skip to content

rune-encoder/Weather-Dashboard

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

31 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Weather Dashboard

Description

If you need to check on the weather, try this weather app. It is super easy to use. You just have to type in the city you wish to check the weather for.

You will get up to date weather information. It will display the current temperature, description, wind speed and humidity. You will also be able to see the the next 5 day forcast for the chosen city.

To make things convenient if you leave the page and return to it in the future, your search history will be displayed. You just have to press on this button to show the updated weather for the city saved in your history.

A little backstory: Creating this app was exiting and scary. There were so many challenges along the way. Some things would break here and there and it would take me a while to find a proper solution. I really tried to challend myself on the syle aswell. It was also interesting trying to figure out how not to have the recent search history and local storage affected by duplicate searches (to prevent duplicate buttons on the search history and duplicate data on local storage). Hope you like it!

Awesome Points:
1. Application is mobile friendly. It will adapt to Desktop mode and Mobile mode.
2. Application saves history. History is easily accessed and cleared.

Installation

N/A

Usage

Navagate to the Webpage using the following link: https://rune-encoder.github.io/Weather-Dashboard/

To start follow these steps:

  1. Navigate to the webpage.
  2. On the search bar type a City of your choosing.
  3. Press on the Search button.
  4. You will then be presented with the current weather information for the chosen City and the next 5 day forecast.
  5. Your search will be saved and will display in your recent searches.
  6. When you re-visit the page you will have easy access to your chosen city by choosing your recent searches.
  7. To clear data stored and the page press on the Clear button.

Screenshot of Homepage in Desktop Mode: Screenshot of Homepage

Screenshot of Homepage in Mobile Mode: Screenshot of Homepage

Credits

Note: Both image background assets were created using Stable Diffusion.

License

Please refer to the LICENSE in the repo.