Utah Weather Checker

Using Ajax, jQuery, and Weather API

Posted on January 26, 2016 in webdev

Using APIs

In my Web Programming Class we are starting to make use of public APIs in our projects. For this project we were tasked with creating a weather checker for Utah cities.

We were encouraged to use Weather Underground's Weather API and use Ajax and jQuery to present the responses to our API calls.


The search box takes in a city's name. I used jQuery's keyup event to create a list of suggested cities as you type. On every keyup, an ajax request is sent to gather a list of cities that match your input.

When you click the "Get Weather" button, a request is sent to the Weather API. From that request I pulled out the location, temperature, and forecast and displayed them in a Bootstrap modal.

The Future

You feel kind of powerful having access to thousands of APIs. It's exciting to think about how you can combine data from multiple sources to create new things. I'm sure someday our clothes, refrigerators, and even our toilets will have some sort of API we can hook into to extract data.

See it on Github

comments powered by Disqus