JSFiddle - React, Tailwind, and code Playground

by daimom

HTML

<div id="container"></div>

CSS

body{
  margin:0;
}
#container{
  display:left;
  
}

JavaScript

var url = 
      "https://api.unsplash.com/photos/?client_id=812193ef71ca946e361ed541979a0cfd91e9419a19235fd05f51ea14233f020a&per_page=5";

var container = document.querySelector("#container");
~async function(){
 console.log("start ");
 await fetch(url,{method:'get'})
  .then(rsp => {
  		console.log("Get Data!");
      return rsp.json()
  })
  .then(function(rsp){
      rsp.forEach(function(item,index){    
        let imgUrl = item.urls.thumb;
        let img = document.createElement("img")
        img.setAttribute("src",imgUrl);
        container.appendChild(img);
        console.log(item.urls.thumb);
      })
      console.log("Finish GetData!")
  })
  .catch(err => {
    console.log('error' + err);
  })
  console.log("End!")
}();