I’ve been working on this project over the past few days on OpenProcessing (link down below), and certainly welcome you to have a look It incorporates quite a bit of material (3D, JSON, API and DOM). It’s a weather station app with data provided by openweathermap. The code is hidden to protect the API key by the way.
Anyway, there interface should be pretty straightforward:
Search for a city in the search bar, and then hit the ‘Search’ button for a list of options.
Click a city in order to display the data (city name, temperature, and general description).
It’s still a work in progress, but I feel this is good enough to at least share in the meantime. I still want to eventually add a toggle between F and C temperatures, along with a few other tweaks. And obviously, any feedback is welcomed as well!
And that was actually one of the things that I was looking at, with the whole ambiguity. Cause the city list json file directly from openweatherapi.org came with all of these extra cities but that’s definitely a good future suggestion & improvement!
…that way the key is not exposed, but people can look at the code.
Of course, if the sketch is under rapid development, keep a copy up-to-date can be one more thing to deal with. But when you want feedback, it can be easy to do and quite useful.
Thanks for sharing your project, it looks cool and managed to find the city I live in here in Sweden. Great work!
A friendly reminder: code that executes on a user’s machine (like in the browser) can never truly be hidden. It can just be obfuscated to some degree. In this specific case, one doesn’t even need to look at the code to figure out the API key. Observing the network traffic to openweathermap.org is enough. Just something to keep in mind.
Sort of a follow up:
For the past few weeks, I’ve actually been working on a version of this sketch with a React version of p5, along with some Bootstrap CSS to make it look a bit nicer and more responsive. Still working on further improvements/cleaning up the code a bit (I learned Redux kind of while doing this, so my initial confusion might make the code feel a bit messy haha), but this should be good enough to share with the public!