This is a project I created for Free Code Camp entitled "Show The Local Weather"

Objective: Build an app that is functionally similar to http://codepen.io/FreeCodeCamp/full/bELRjV.

Fulfill the below user stories. Use whichever libraries or APIs you need. Give it your own personal style.

User Story: I can see the weather in my current location. User Story: I can see a different icon or background image (e.g. snow mountain, hot desert) depending on the weather. User Story: I can push a button to toggle between Fahrenheit and Celsius.

I ended up using The SimpleWeather API. No key necessary, and it supports geolocation. It's excellent.

To view this project, please visit https://interglobalmedia.github.io/simpleweather/

October 29, 2016: Main challenge I have faced with this project was trying to use Webpack with it because I wanted to create js modules incorporating es6 features, but the project depends on a jQuery plugin (http://simpleweatherjs.com/). This caused issues with the loading of jQuery in the proper locations when creating a js build. The definition of jQuery was not recognized in the simpleWeather plugin, and neither was the $.simpleWeather extend method. I know there must be a way of fixing this. I just haven't figured it out yet. However, since I had done a local install of all dependencies/devDependencies for this project and was still able to include the simpleWeather plugin via CDN, I went with the original workflow I created for this project. It works fine. It's just not as quick or smoothly automated as I would like! The reason I went with this particular plugin API was that it was the only weather API out there that didn't require an ID or key. I didn't want to expose such information on the Front End. I tried using Yahoo Weather's YQL as well, but it also had its limitations. Yahoo does use its Weather API YQL with React on its own weather page, so that MIGHT be a good project when I delve into React.

There is also a slight load issue with the geolocation. Sometimes, if it does not load immediately, you get an "undefined" message for a split second, and then the location and temperature load right after. Sorry for the inconvenience. Still trying to figure that one out.

Built With

Share this project:

Updates

posted an update

I finally figured out how to use the simpleWeather jquery plugin I was trying to use with my Gulp Workflow. It was NOT a webpack issue. It, as I originally had suspected, was a jquery load issue. I took down the workaround workflow that I wasn't happy with and uploaded the version of this project with the Gulp workflow I had set up in case if I would find the answer to my problem. And I did! So feel free to check out the new simpleweather!

Log in or sign up for Devpost to join the conversation.