ranking.js

document.addEventListener('DOMContentLoaded', () => {
   fetch('http://127.0.0.1:5000/getAll') // , headers
   .then(response => response.json())
   .then(data =>  loadHTMLTable(data['data']));

});

const addBtn = document.querySelector('#add-name-btn');

addBtn.onclick = () => {
    const nameInput = document.querySelector('#name-input');
    const name = nameInput.value;
    nameInput.value = '';

    fetch('http://127.0.0.1:5000/insert', {
        headers: {
            'Content-type': 'application/json'
        },
        method: 'POST',
        body: JSON.stringify({ name : name })
    })
    .then(response => response.json())
    .then(data => insertRowIntoTable(data['data']));

}

function insertRowIntoTable(data) {

}

function loadHTMLTable(data) {
    const table = document.querySelector('table tbody');

   // console.log(data);

    if (data.length === 0) {
        table.innerHTML = '<tr><td class="no-data" colspan="5">No Data</td></tr>';
    }
}