Overwiew
This is a solution to the
IP address tracker challenge on
Frontend Mentor. Frontend Mentor challenges help to improve coding skills by building realistic projects.
Vanilla JavaScript application for determining location based on the IP Address. Utilizes IPWHOIS.io - IP Geolocation API and Leaflet library for generating interactive maps.
- HTML5
- CSS3
- Vanilla JavaScript
- IP Geolocation API - IPWHOIS.IO
- Leaflet library for generating interactive maps
Workflow
- Project initialization as a public repository on GitHub
- Planning out HTML structure and CSS classes based on design files
- Writing out HMTL and preparing it for DOM interactions with JavaScript
- Styling the page from top to bottom by utilizing mobile-first approach
- Adding media queries for desktop layout
- Integrating IP Geolocation into the script
- Adding the interactive map and binding it to Geolocation data
- Configuring repository to publish code with GitHub Pages
Fulfilled user stories
- View the optimal layout for the site 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 and see the key information and location
