IP Address Tracker using html, CSS and ES6

Community feedback

• 

  Rayane•1,935

  @RayaneBengaoui

  Posted about 4 years ago

  Hello Amir Afshar,

  Congrats for completing this challenge ! 🙂

  I would like to suggest :

  • Add background-repeat: no-repeat and background-size: cover on your header to make the background fill the entire container and avoid duplication of the image.

  • Add something that shows it's processing during the loading time for the user experience. On my solution I used a classic spinner, but also something else.

  • Handle invalid input. You could use a try/catch or even a Regex to filter invalid inputs and display an error message to the user.

  • On mobile view, move the Zoom in/out buttons to the bottom because it's hidden between the info container. If you are blocked, I've made it on my solution to this challenge. Also, you can read the official documentation of leaflet where they explain it.

  • Add some more padding and spacing to match better the design.

  Overall, well done for the challenge and happy coding ! 😃

  01