Design comparison
SolutionDesign
Solution retrospective
Dear Frontend Mentor Challegers,
I am happy to share this project IP Tracker with you guys.
In this website that I built, users should be able to:
- View the optimal layout for each page depending on their device's screen size
- See hover states for all interactive elements on the page
- See their own IP address on the map on the initial page load
- Search for any IP addresses or domains in n both formats IPv4 and IPv6 and see the key - information and location
- See the instructions to use the application in their first visit
- See the ip adresses that they searched for before in the ip tracker
- See the information about the marker, when they clicked on it
- Delete the markers
I would like to also share with you the usefull resources for this project as well.
- Leaflet JS Library => (https://leafletjs.com/examples/quick-start/) -I used this JS Library for the interactive map on the project.
- IAPI => (https://ipapi.co/) -I used this API to get the informations about IP's.
- Ipify => (https://www.ipify.org/) -I used this API to get the informations about IP's.
- JAWG => (https://www.jawg.io/docs/) -I used the tile for the map with Leaflet.
- Leaflet Providers => (https://github.com/leaflet-extras/leaflet-providers) -An extension to Leaflet that contains configurations for various free tile providers.
Please feel free to give feedback,it will be much appreciated.
Keep Coding!
Community feedback
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