The API Tide Tool uses the Environment Agency Tide Gauge API made available by the Environment Agency on behalf of the UK Coastal Flood Forecasting service.
The web app was built using Sveltekit and Bootstrap.
On load a fetch request is made to: https://environment.data.gov.uk/flood-monitoring/id/stations?type=TideGauge&unitName=m
The data returned from the API endpoint is used to populate the dropdown list, specifically the "Label" element of the returned json data. Other information is used later on but not by the dropdown list.
When a user selects a station from the drodown list the station "label" and "station ID" are passed through to a page function which makes a call to a second API. This API endpoint returns measurements for the particular station selected. This return is limited to the last 2 readings by using limit=2 in the API endpoint.
The returned data is displayed as the current level (the most recent reading from the station) and the previous level (the second to last reading returned from the station). A little bit of logic is then used to calculate which arrow to show.