JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://json-to-html-table-with-vertical-or-horizontal-headingsjs-site.orionhub.org:8080/json-to-html-table-with-vertical-or-horizontal-headings.js"></script>
<body>
    <div id="table-container"></div>
</body>

JavaScript

//Example data, JSON Object 
var input_json = [{
    "fcodeName": "capital of a political entity",
        "toponymName": "Mexico City",
        "countrycode": "MX",
        "fcl": "P",
        "fclName": "city, village,...",
        "name": "Mexiko-Stadt",
        "wikipedia": "en.wikipedia.org/wiki/Mexico_City",
        "lng": -99.12766456604,
        "fcode": "PPLC",
        "geonameId": 3530597,
        "lat": 19.428472427036,
        "population": 12294193
}, {
    "fcodeName": "capital of a political entity",
        "toponymName": "Beijing",
        "countrycode": "CN",
        "fcl": "P",
        "fclName": "city, village,...",
        "name": "Peking",
        "wikipedia": "en.wikipedia.org/wiki/Beijing",
        "lng": 116.397228240967,
        "fcode": "PPLC",
        "geonameId": 1816670,
        "lat": 39.9074977414405,
        "population": 11716620
}, {
    "fcodeName": "capital of a political entity",
        "toponymName": "Manila",
        "countrycode": "PH",
        "fcl": "P",
        "fclName": "city, village,...",
        "name": "Manila",
        "wikipedia": "en.wikipedia.org/wiki/Manila",
        "lng": 120.9822,
        "fcode": "PPLC",
        "geonameId": 1701668,
        "lat": 14.6042,
        "population": 10444527
}, {
    "fcodeName": "capital of a political entity",
        "toponymName": "Dhaka",
        "countrycode": "BD",
        "fcl": "P",
        "fclName": "city, village,...",
        "name": "Dhaka",
        "wikipedia": "en.wikipedia.org/wiki/Dhaka",
        "lng": 90.40743827819824,
        "fcode": "PPLC",
        "geonameId": 1185241,
        "lat": 23.710395616597037,
        "population": 10356500
}, {
    "fcodeName": "capital of a political entity",
        "toponymName": "Seoul",
        "countrycode": "KR",
        "fcl": "P",
        "fclName": "city, village,...",
        "name": "Seoul",
        "wikipedia": "en.wikipedia.org/wiki/Seoul",
        "lng": 126.9784,
        "fcode": "PPLC",
       ...