I have completed my weather app, but have been trying to improve it and make my code better. I created it using a lot of trial and error and don’t fully understand how and why it works. I have a lot of questions about this stuff, but I’m going to try and minimize it to two specific ones for now.
First, here is a link to my weather app pen - http://codepen.io/derekbmcintire/pen/oZoJLB
If you have any trouble with it loading let me know, it doesn’t work for me on my laptop unless i run, then refresh debug mode, but others have said it works fine for them.
So, my first question is about the function getWeather(); - you can see that I declared a bunch of variabes and then called this function. The function appears in yellow. Below it is where the function is actually written out. If I delete the call at the top, and call the function below where it is written out, the program no longer works and getWeather(); appears in blue. Why is this? It seems like the call turns blue when it matches to an existing function, so I expected the opposite to happen.
My second question has to do with the weather icon. It functions correctly, but since I have added a search bar, when the city is changed, the weather icon also needs to change. I accomplished this by writing the exact same code twice, once in the getWeather function, and the second time in the onClick function. I was under the impression that the purpose of functions was to reduce the amount of code you have to write and I am sure there is a way of doing this without writing that huge if/else statement out twice, but I have not been able to figure out how. I have been working on this off and on over the last month and have even asked about it here on the forum but the only response I got told me to check out reactJS, which doesn’t really help me understand what is happening or why.
Also, if anyone has any easy sources for understanding functions more please send them my way. I have read through a lot of the static resources linked here and watched several youtube tutorials, but have trouble applying what I learned on really simple straight forward examples to my own projects.