IP Address Tracker API

What are you most proud of, and what would you do differently next time?

I'm proud of the JS - it works, it fetches well. I used an updateDisplay() function to wrap repeatable code in instruction for each of the four fields instead of writing 4 if/else or switch conditions which felt wasteful. That really helped me to understand the beauty of functions. The more complicated projects I do, the more I understand the control flow/call stack in the script which helps me to debug a lot better.

What challenges did you encounter, and how did you overcome them?

The layout was a little tricky - alignment, layering elements, positioning. I didn't know about pointer-events-none and pointer-events-auto which fixed the relationship between layered clickable elements and how we want the user to be able to bypass certain containers, making them invisible to the browser, so that they can interact with the item underneath. Very useful.

What specific areas of your project would you like help with?

Lmk if there can be any improvement to the script.js, as well as the layout. I added an error state for usability, but I don't like how it currently stands and will adjust it. I'm thinking about how it can sit in the flow nicely and responsively, but I'm not prioritising that right now.

Anyone know a way to have an API with a key work on production, without having to expose your key? I found that while I could hide it well enough locally, once deployed, it seemed to be the only option was to expose the key so the API would work. Any ideas? What is conventional to do in these kind of instances?