This is a solution to the IP address tracker challenge on Frontend Mentor.
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 Virtual IP address on the map on the initial page load
- Search for any Virtual IP addresses or domains and see the key information and location
- Solution URL: https://github.com/AshadeSamson/IP_Tracker
- Live Site URL: https://ip-tracker-app.glitch.me
- Semantic HTML5 markup
- CSS Position properties
- Flexbox
- Mobile-first workflow
- leaflet.js - JS library
- express.js - Node.js framework
Though I started the project as a frontend-based project, but the need to abstract my API keys from the browser led me to learning about how a backend can help me out. I learnt about server side renedering(SSR) and static site generation(SSG) using Node.js and it's Express.js framework.
- ipify.org - Helped to capture the user's ip. really a nice feature.
- Coding Train YT channel - This YT series really helped in explaining how to work with APIs and connect backend and frontend codes in javascript.
- Website - Ashade Samson
- Frontend Mentor - @AshadeSamson