- # of words: 442
This weather app is part of the intermediate projects of FreeCodeCamp Frontend track. It started out really rough with the API they suggested using. So I decided to go with WeatherUnderground API, which has far more features and better icons.
- User Story: I can see the weather in my current location
- User Story: I can see a different icon or background image (e.g. snowy mountain, hot desert) depending on the weather.
- User Story: I can push a button to toggle between Fahrenheit and Celsius.
One of the main hangups on this project was getting data from the API, but that was more a problem with the API and Codepen. Instead of using the HTML5 Geolocation I found it much easier to get it from the IP address. The two main issues I’ll talk about in this case study are cycling through the API object and switching between Imperial/Metric.
I decided to attach a data attribute to the button and have it be equal to whatever is being shown on the screen. I decided to put the logic for this inside of the getLocation function since I didn’t want to rewire everything. In $document.ready there’s an if statement that sets the text and data of the button and then gets the location. In the getLocation function it checks the role of the button and then calls setWeather with the appropriate argument. This allows for us to check which data we want to assign to the variables we call from the api.
That wraps up what I learned from this really fun project. My understanding of APIs has really deepened and I’m sure it will increase even more in the next two challenges.