API Table - AJAX/PHP/CURL/JSON Example

Published: 15 April 2023
on channel: derekthesec

459

The aim is to produce an API Table with 3 APIs. Each API has the name (e.g. ocean) and description. There is a Submit Button to submit user inputs. The APIs are taken from the GeoNames Web Services Overview. API stands for Application Programming Interface.

The description includes user inputs. For example, in the ocean API there is latitude and longitude.

The APIs are Ocean, Hierarchy and Siblings.

User Stories

As a user, I can input the latitude and longitude. Or I can just accept the selected values.

As a user, I can select the placename or attraction or just accept the selected value.

As a user, I can select the country name or just accept the selected value.

As a user, if I hover over one of the Submit Buttons, the background colour changes.

As a user, if I select the Submit Button for the Ocean API, I can get the distance, geoname ID and name unless the ocean cannot be found.

As a user, if I select the Submit Button for the Hierarchy API, I can get the names and feature codes.

As a user, if I select the Submit Button for the Siblings API, I can get the names and toponym names.

Information Architecture

Latitude is between -90 and 90
Longitude is between -180 and 180
Placenames or Attractions are Bromley, Beckenham, Chislehurst, London, Cambridge, Cambridge Railway Station, Manea, Menton, Torremolinos, La Bateria Park, Prague and Mustek
Country Names are United Kingdom, France, Spain, Germany, Czechia, Portugal, Italy, Ireland, Netherlands, Russia and Turkey

Features

Allows the user to input latitude and longitude in order to get the distance, geoname ID and name of the ocean or sea. Except when the ocean cannot be found for this latitude and longitude.

Allows the user to select placename or attraction from the dropdown list in order to get the names and feature codes.

Allows the user to select country name from the dropdown list in order to get the names and toponym names.

Technologies

Uses HTML5, CSS3, JavaScript with jQuery and PHP.

Live Project at https://www.derekdhammaloka.co.uk/task

Acknowledgements

Geonames - www.geonames.org
Stack Overflow - www.stackoverflow.com
W3Schools - www.w3schools.com
IONOS - www.ionos.co.uk

Date of completing the Preparatory Task - 14 April 2023.

On this page of the site you can watch the video online API Table - AJAX/PHP/CURL/JSON Example with a duration of hours minute second in good quality, which was uploaded by the user derekthesec 15 April 2023, share the link with friends and acquaintances, this video has already been watched 459 times on youtube and it was liked by 2 viewers. Enjoy your viewing!

994