Track Ip Address and locate them on the map

• Solution URL: IP Address Tracker

• Semantic HTML5 markup
• CSS custom properties
• Flexbox
• CSS Grid
• Mobile-first workflow
• Vanilla Javascript

• I learnt how to work with map in Javascript by using the leafleat map
• With the help of a little bit of googling, I was able to format the Ip address in the correct format using regex and check it against the value of the input field

 const ipformat = /^(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)\.(25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;

To see how you can add code snippets, see below:

<h1>Some HTML code I'm proud of</h1>

.proud-of-this-css {
  color: papayawhip;
}

const proudOfThisFunc = () => {
  console.log('🎉')
}

• One of the challenge I faced with this project is resetting the map if another Ip address is supplied by the user. I was able to overcome this challenges with the code below:

// resets the map div
if (L.DomUtil.get('map') !== undefined) {
      L.DomUtil.get('map')._leaflet_id = null;
    }

• Website - Williams Samuel
• Frontend Mentor - @williamssam