This is a solution to the IP address tracker challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.
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 and see the key information and location
- Solution URL: https://github.com/rafaeldevvv/frontendmentor-ip-address-tracker
- Live Site URL: https://rafaeldevvv.github.io/frontendmentor-ip-address-tracker/
- Semantic HTML5 markup
- CSS custom properties
- Flexbox
- CSS Grid
- Mobile-first workflow
- IP Geolocation API by IPify
- LeafletJS
- Tippy.js
- Font Awesome
- CSS in Action Invisible Content Just for Screen Reader Users
- Can I Use CSS Nesting?
- Why do percentage-width-sized flex box items not properly increase the width of a wrapping table that has an unspecified (i.e. auto) width?
- A Complete Guide to Flexbox
- Regular expression that matches valid IPv6 addresses
- CSS animate custom properties/variables
- What is a regular expression which will match a valid domain name without a subdomain?
- 6 Free Libraries to Create Tooltips in JavaScript
The name's Rafael Maia. You can find me on Instagram, X, and Linkedin. Or you can send me an email rafaeldeveloperr@gmail.com.
I am a freelancer, so you can also find me on Fiverr and Upwork.
Also, take a look at my portfolio.
Also, if you liked this project, consider buying me a coffee ☕.