gistfile1.txt

let randomUser;

fetch("https://randomuser.me/api")
  .then((response) => {
    return response.json();
  })
  .then((data) => {
    randomUser = data.results[0];

    console.log(randomUser);

    let id = randomUser.id.value;
    let fullName = randomUser.name.first + " " + randomUser.name.last;
    let email = randomUser.email;
    let phone = randomUser.phone;
    let street =
      randomUser.location.street.number + " " + randomUser.location.street.name;
    let city = randomUser.location.city;
    let state = randomUser.location.state;
    let country = randomUser.location.country;
    let mediumPicture = randomUser.picture.medium;

    let bodyTag = document.querySelector("body");
    bodyTag.style.textAlign = "center";
    bodyTag.style.marginTop = "50px";

    let imgTag = document.createElement("img");
    imgTag.src = mediumPicture;

    let igTag = createTagWithContent("ID", id);
    let fullNameTag = createTagWithContent("Full Name", fullName);
    let emailTag = createTagWithContent("Email", email);
    let phoneTag = createTagWithContent("Phone", phone);
    let streetTag = createTagWithContent("Street", street);
    let cityTag = createTagWithContent("City", city);
    let stateTag = createTagWithContent("State", state);
    let countryTag = createTagWithContent("Country", country);

    bodyTag.appendChild(imgTag);
    bodyTag.appendChild(igTag);
    bodyTag.appendChild(fullNameTag);
    bodyTag.appendChild(emailTag);
    bodyTag.appendChild(phoneTag);
    bodyTag.appendChild(streetTag);
    bodyTag.appendChild(cityTag);
    bodyTag.appendChild(stateTag);
    bodyTag.appendChild(countryTag);
  });

function createTagWithContent(label, value) {
  const tag = document.createElement("p");
  tag.innerHTML = `${label} : ${value}`;

  return tag;
}