Weather-Dashboard

[link to the Weather-Dashboard here!] ( https://arand013.github.io/Weather-Dashboard/ )

  • GIVEN a weather dashboard with form inputs
  1. WHEN I search for a city
  • THEN I am presented with current and future conditions for that city and that city is added to the search history
  1. WHEN I view current weather conditions for that city
  • THEN I am presented with the city name, the date, an icon representation of weather conditions, the temperature, the humidity, the wind speed, and the UV index
  1. WHEN I view the UV index
  • THEN I am presented with a color that indicates whether the conditions are favorable, moderate, or severe
  1. WHEN I view future weather conditions for that city
  • THEN I am presented with a 5-day forecast that displays the date, an icon representation of weather conditions, the temperature, the wind speed, and the humidity
  1. WHEN I click on a city in the search history
  • THEN I am again presented with current and future conditions for that city

Construction

This Weather Dashboard is generated with:

HTML CSS JAVASCRIPT

Steps:

  1. Began index html structure
  2. Wireframing div's then implementing FlexBox w/ Bootstrap in the body along and with headings.
  3. Begin to add classes, id's, button's, containers, onclick and eventListeners to the index
  4. Moved onto creating CSS structure such as padding, borders and card styles
  5. Started javascript, by introducing variables, forloops, functions, if else statments.
  6. After, introduced API calls and Jquery to Append and add (Temperature, Humidity, Wind Speed) with API calls.
  7. Comments were also applied in pseudo code
  8. Created branches to add, commit, push and merge with github

Screen Shot 2021-05-30 at 11 08 47 PM

Screen Shot 2021-05-30 at 11 01 51 PM

Screen Shot 2021-05-30 at 11 01 40 PM