Week 03 - Day 2 - Weather API

[mdewey]

Cloudy with a chance of Syntax Error

Using a popular weather API, Create a web site that allows a user to search for a location and gets that location's weather.

Objectives

• Practice working with an API
• Practice working with data that was structure by a third party

Requirements

• Using openweathermap.org, create a simple UI that allows a user to search for the current weather by zip code or city.

SIGN UP!

• [x] Visit openweathermap.org and signup for an account
• [x] Visit API Keys in your dashboard
• [x] Copy your API key
• [x] You can use the API key in any of the URLs by appending appid=KEY
  • Example: from the docs https://api.openweathermap.org/data/2.5/weather?q=Tampa becomes https://api.openweathermap.org/data/2.5/weather?q=Tampa&appid=cbb5b6537cd4a6eccd9aee04ffffffff
  • NOTE: It will take about 10 to 30 minutes for your API key to be active

Explorer Mode

• [x] Create a simple HTML page that has a text box and a search button
• [x] Allow the user to type in a place, click the search button, and, using openweathermap.org, get the current weather for that location.
• [x] Display the weather to the user by adding elements to the DOM.
• [x] Allow the user to search by zip code or city name.

Adventure Mode

• [x] Using the HTML5 Geolocation API, search for the user's current location when the page loads.
• [x] Store the Users last search and use it to search for the value on page load. HINT: localstorage
• [ ] remove the need for the search button and search when the user stops typing. HINT: use setTimeout and the change event. to track when the user stops typing.

Epic Mode

• [ ] Add a type-ahead using Google Places API
• [ ] Head back to Blackjack and use this as your API.

Slides:

https://slides.com/markdewey-1/promises-apis-fetch-json

[GarrettAnderson]

Able to get weather data by zipcode and by city but only in the US.

[GarrettAnderson]

Was able to get local storage to store the zipcode when user inputs in the search field. Found the geolocation api but haven't been able to get the location to automatically populate.

[GarrettAnderson]

https://github.com/GarrettAnderson/weather-api

[GarrettAnderson]

got a local storage object to be returned on page load but it is still one that i used in the input value previously. the on page load continues to return the same zipcode that I used before to search. Kinda mixed up about the logic of the local storage - do I need to set the local storage in the search button click functions? Geolocation doesn't seem to be working correctly.

[GarrettAnderson]

Saw in the console that I got the current location to be returned in an object on page load but not sure how to extract that aside from using lat and long values.

[mdewey]

Your homework was marked: Meets Expectations

“With LASERS” — via Jason L Perry