ipLookUp API: Finding My IP Address
This part was completed in my previous lab 2 activity. I basically used the ipLookUp API to fetch the IP of my current location. I will be posting my source code at the end, but you can find this part under the UserIP.js file.

ip-api API: Finding My Coordinates
For this part, I was suppose to use the GeoIP API to find my coordinates, but it was not cooperating with me. I kept getting a 502 Error.

After failing to find a solution, I decided to use another API and stumbled across ip-api. Similar to GEOIP, its response contained location data. It was neat that this API automatically found my IP address and used it to locate my coordinates.

These are the information returned in json format:

{"status":"success","country":"United States","countryCode":"US","region":"PA","regionName":"Pennsylvania","city":"Williamsport","zip":"17701","lat":41.2382,"lon":-76.9978,"timezone":"America/New_York","isp":"Comcast Cable Communications, LLC","org":"Comcast IP Services, L.L.C.","as":"AS7922 Comcast Cable Communications, LLC","query":"73.230.71.189"}

However, to fully understand this assignment, I needed to incorporate what I had in my second lab. Luckily, ip-api had an option for developers to manually input an IP address.

In the getGEOIPData() function, an instance of UserIP(named IPClass) was created. Next, using IPClass's updateUser() function, my IP address can be returned. In fetch, both the locationEndpoint url("http://ip-api.com/json/") and my IP address is combined. ip-api will then use this information to respond with my location data. I was able to plug this information into the Google Maps URL and the wikipedia-query element.

Result
This is how my website looked like when everything worked!

Links

• My GitHub Source Code

• ip-api API

• wikipedia-query Element