IP Address Tracker built with React, styled components and Mapbox
Design comparison
Solution retrospective
First time using styled components outside of a tutorial.
I added loading and error states for when the API is fetching and/or returns unsuccessfully.
Learned a lot about leaflet. And getting environment variables to work in a production environment. Guess I relied on dev-ops folks too much in the past. 😅
Community feedback
- @OlehTovkaniukPosted over 3 years ago
Are you aware that enviroment variable doesn't secure your API key? Here is discussion about this theme: https://stackoverflow.com/questions/48699820/how-do-i-hide-api-key-in-create-react-app
1@MatthiasSmithPosted over 3 years agoThanks for posting this resource. It helped motivate me to take some time to learn and use the serverless functions features that are available on Vercel. I've updated the app with the changes.
1@OlehTovkaniukPosted over 3 years ago@MatthiasSmith you've got some bug. ip addresses don't fetch
1@MatthiasSmithPosted over 3 years ago@OlehTovkaniuk - Yes, just fixed this. Thanks again for testing! 🙏
0@OlehTovkaniukPosted over 3 years ago@MatthiasSmith You've done some decent work on this challange. It is really great opportunity for me to have a look at work of a skilled developer and learn from it. Thanks a lot.
0@MatthiasSmithPosted over 3 years ago@OlehTovkaniuk Thanks! It means a lot. And thank you for your continuous feedback and testing. Happy coding! 😎
1 - @ChamuMutezvaPosted over 3 years ago
Good work Matthias. It is working as expected, i like most the error handling functionality.
Happy coding
1 - @OlehTovkaniukPosted over 3 years ago
Did you have any issues with AdBlocker in Opera and Brave browsers??
0@MatthiasSmithPosted over 3 years ago@OlehTovkaniuk Yes, I did. The IP Geolocation API was being blocked. Switching over to making the requests from the server instead of the client fixed the issue for me (in addition to hiding my API tokens).
1
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord