Skip to content

TheInfamousGrim/cumulo-weather-dashboard

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

28 Commits
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Cumulo Weather Dashboard 🌡️☁️

A weather dashboard to show the weather in your location as well as one that is searched

Table of Contents 📃

  1. Description
  2. Screenshot
  3. Usage
  4. Technology
  5. Features
  6. Badges
  7. Credits
  8. License
  9. Feedback

Description

An application which can dynamically show the weather of the users current location (if they accept to share their information).

The user can search for any city in the world in order to view what the current and future weather conditions are.

Any city that the user searches is saved to the local storage and presented in a list where the user can:

  • Press a button to search for the city weather conditions again
  • Or delete the city search data from the list and local storage

When the weather from the desired location is looked up a card showing todays weather displays:

  • The city name
  • An icon showing the general weather conditions
  • The current temperature
  • The current wind speed
  • The current humidity
  • The current UV index

Below that the user is presented with a five day forecast, with each forecast card showing:

  • The day of the forecast
  • A weather icon showing the general weather conditions of the day
  • The wind speed of that day
  • The humidity of that day

User Story 👤

AS A traveler I WANT to see the weather outlook for multiple cities SO THAT I can plan a trip accordingly

What did I Learn 🏫

I've already been introduced to jQuery and Day.js and they came in handy here. Although I'm not a huge fan of jQuery as it seems that you can traverse the DOM with ease using JavaScript, it's still used by so many sites that I'm going to keep practicing with it till I'm more comfortable using it.

I again furthered my knowledge of getting data from API's and manipulating the data so that I can dynamically present end data to the user, specifically becoming more comfortable with async functions.

I decided to start learning another framework as well, which was Materialize. Definitely prefer using bootstrap, did not find it as intuitive. But if the need to use another framework in my working life ever pops up then I'm in the money.

Other things I learned:

  • how to manipulate elements using jQuery, whether that's selecting, appending or removing etc.
  • Override framework stylings to either fix things or add my own stylings
  • Manipulate data from a third party API

Screenshot

The weather dashboard application, with weather cards, a search form and a search history

Usage

Website Status

If you would like to use this application please follow this link.

If you would like to develop this application further, feel free to fork the project or pull it for yourself.

Technology

The technology used for the development of this app was:

Features

  • search for the weather in any major city in the world
  • show the weather in your current location
  • show a five days of forecasts
  • save your searched cities to the local storage and the search history card

Badges

Contributor Covenant

Credits

🙏 Made with the help of:

License

License: MIT

MIT License

Feedback

Ask Me Anything

Any feedback please email George Fincher

About

A weather dashboard to show weather in your location as well as one that is searched

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published