PerseusRipple / assignments

0 stars 0 forks source link

Week 03 - Day 2 - Weather API #10

Closed mdewey closed 5 years ago

mdewey commented 5 years ago

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

[ ] Using the HTML5 Geolocation API, search for the user's current location when the page loads.
[ ] 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

PerseusRipple commented 5 years ago

https://github.com/PerseusRipple/get-weather

I'm not promising but you might find a font awesome icon...

PerseusRipple commented 5 years ago

and also, thank you.

mdewey commented 5 years ago

Your homework was marked: Meets Expectations

Ring that bell!

“Ring that bell!” — via Mark Dewey