JSFiddle - React, Tailwind, and code Playground

by grant

HTML

<div id="last10images"></div>

JavaScript

var p_site = 'https://grantamaral.com/piwigo/ws.php'; //piwigo web api location
var p_query = '?format=json&method=pwg.categories.getImages&per_page=10&order=date_available%20desc'; //piwigo api query parameters
var request = new XMLHttpRequest();
request.open('GET', p_site + p_query, true);
request.onload = function() {
  if (request.status >= 200 && request.status < 400) {
    // Success!
    var mydata = JSON.parse(request.responseText);
    console.log(JSON.stringify(mydata, null, '    ')); //show the Piwigo Api response
    if (mydata.result.images) { //if response array is not null
      for (i=0; i < mydata.result.images.length; ++i) { //loop the response array
        document.getElementById('last10images').innerHTML += '<a href="'+ mydata.result.images[i].page_url + '"><img src="' + mydata.result.images[i].derivatives.square.url + '" /></a>';
      }
    }
  }
  else {
    // We reached our target server, but it returned an error
  }
};
request.onerror = function() {
  // There was a connection error of some sort
};
request.send();