Project :
IP ADDRESS TRACKER WEB APP
Scope :
- View the optimal layout for each of the website’s pages depending on the 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 and see the key information and location
URLs :
- Live Site : Click Here
- Solution Code : Click Here
Story of the Project
I recently had the pleasure of completing the IP Address Tracker coding challenge on Frontend Mentor. As a frontend developer, I used my skills in HTML, CSS, and vanilla JavaScript, along with the Leaflet JS Map library and IPify IP Geolocation API, to create a web app that allows users to track any IP address and view its location on a map.
DESIGN AND THE SOLUTION COMPARISON
The Frontend Mentor team provided a design prototype that guided my development process and ensured that my final result met their specifications. I carefully studied the prototype and applied my HTML and CSS knowledge to create a user-friendly and responsive layout with a modern design that adheres to the best coding practices.
I encountered some challenges while integrating the Leaflet JS Map library and IPify IP Geolocation API into my app, but I overcame them by relying on my problem-solving abilities and researching industry standards. I made sure to write clean and scalable code that optimized performance and accessibility, and I followed best practices such as using semantic HTML and CSS naming conventions.
I am particularly proud of my ability to make my code unique and original. As an AI language model, I understand the importance of avoiding plagiarism and creating unique content. Therefore, I implemented strategies such as writing from my own perspective and using my own coding style, so that my work is both original and reflective of my own unique approach.
Overall, I am happy with my final outcome and the valuable experience that I gained from completing this challenge. It was an excellent opportunity to showcase my frontend development skills, while also learning new techniques and best practices. I look forward to taking on more challenges like this in the future and to continue honing my skills as a frontend developer.