Dynamic html table from Json response.

function translateResponseKey(key) {
  const translations = [{
    key: 'country_name',
    value: 'Country'
  }, {
    key: 'total_cases',
    value: 'Total cases'
  }, {
    key: 'new_cases',
    value: 'New Cases'
  }, {
    key: 'total_death',
    value: 'Total Deaths'
  }, {
    key: 'new_death',
    value: 'New Deaths'
  }, {
    key: 'total_recovered',
    value: 'Total Recovered'
  }, {
    key: 'active_cases',
    value: 'Active Cases'
  }, {
    key: 'critical_cases',
    value: 'Critical Cases'
  }, {
    key: 'tot_cases_per_million',
    value: 'Cases per million people'
  }, {
    key: 'tot_death_per_million',
    value: 'Deaths per million people'
  }];

  return translations.find(item => item.key === key).value;
}

function renderDataTable(data, selector = "body") {
  const outputContainer = document.querySelector(selector);

  if(!outputContainer) throw new Error("The provided selector does not exist on the page.");


  const table = document.createElement("table");
  const headerRow = document.createElement("tr");
  const dataRow = document.createElement("tr");

  for(let key in data) {
    const headerCell = document.createElement("th");
    const dataCell = document.createElement("td");
    const value = data[key];

    headerCell.textContent = translateResponseKey(key);
    dataCell.textContent = value;

    headerRow.appendChild(headerCell);
    dataRow.appendChild(dataCell);
  }

  table.appendChild(headerRow);
  table.appendChild(dataRow);
  outputContainer.appendChild(table);
}

async function get(url, config = {}) {
  const response = await fetch(url, config);
  const data = await response.text();
  console.log({data});
  return data;
  // return JSON.parse('{"data":{"country_name":"pakistan","total_cases":"2386","new_cases":"268","total_death":"32","new_death":"5","total_recovered":"107","active_cases":"2247","critical_cases":"12","tot_cases_per_million":"11","tot_death_per_million":"0.1"}}');
}

async function main(url) {
 const { data } = await get(url);
 renderDataTable(data);
}

const url = "https://covid-rest.herokuapp.com/pakistan";
// const url = "https://jsonplaceholder.typicode.com/photos";
main(url);