Weather App Finished But Stuck With One Thing(SOLVED)

Weather App Finished But Stuck With One Thing(SOLVED)
0.0 0

#1

Finally, WeatherApp done! Review, anybody? I’m just not sure how to handle wrong city name entered as the api returns nothing at all. Not even an object(checked with console.log)! Also, I’ll refactor the code asap…

Link: https://codepen.io/Smokahontas/full/OvorwK/


#2

Instead of using callbacks, you could use the more “modern” approach of promises (which jQ supports) and catch the error:

$.getJSON(urlStr)
.done(function(data) {
  // do your success magic here
})
.fail(function(jqXHR, textStatus, errorThrown) {
  // handle the error
})

Then you can do what you want when the API doesn’t respond with good data.


#3

This is really interesting. I’ll look into it asap tomorrow morning! Thanks man! :star_struck:


#4

I couldn’t resist trying that and Wow!!! It works!!! Thank you so much!!!


#5

It works although its weird with cities outside the US. If I enter City, CA (for canada) it gets the weather but it says city, ca, CA

Also maybe a hint of how to enter the name, i tried like 6 ways before I used the right format.

Really impressive though. good work


#6

Hey, Kevin. I also inputted code where i can get the local time of that city on the top right corner of the browser. It works locally but it doesn’t work on codepen. Why so?


#7

Thanks, man! Yes, I did made an alert system if someone enters the wrong city. But good idea, I should give the hint too! Thanks :blush:


#8

Another problem is since one city name can be in multiple states and even counties, how can the user be guaranteed the correct city? For example, I live in San Jose, California, USA. If I enter San Jose into your app, I get back the weather for San Jose in the Philippines.


#9

hmmmmm. that’s a good point! I didn’t even think about that. I’ll fix this asap!
by the way, any idea why the time for the city doesn’t show in codepen, but it shows up locally?


#10

Sure, look at your browser’s console and you will see the following error.

pen.js:54 Mixed Content: The page at ‘https://codepen.io/Smokahontas/pen/OvorwK?editors=1000’ was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint ‘http://api.geonames.org/timezoneJSON?lat=37.08&lng=-88.6&username=smokahontas’. This request has been blocked; the content must be served over HTTPS.

Because Codepen is served over https, you can not request a page which is served over http, because it has to at least have the same security as the hosting page (Codepen in this case). It works locally, because you are probably not serving over https. Unfortunately, you will need to find a secure api to display the local time of the city.


#11

Well, there! Thanks for clearing it up! I wish those geonames people updated their site to https. It’s not that hard, is it? I’m still learning so I’m not sure.

Also, are you a camper or from the FCC Crew? I see you everywhere in here :smile: