JS LEVEL UP #1

This is a guide for those of you who are looking for how to get/display and create layouts from data sheets to html/js JSON.
I made it as simple as possible to display 1 rows.

Okay here you can create a file mejquery.js.
Below is an example code of js :

let url = 'https://docs.google.com/spreadsheets/d/YOUR_DISPLAY_CSV/gviz/tq?';
const output = document.querySelector('.output');
const query = encodeURIComponent('Select A');
console.log(query);
url = url + '&tq=' + query;

fetch(url)
.then(res => res.text())
.then(rep => {
    const data = JSON.parse(rep.substr(47).slice(0,-2));
    const row = document.createElement('me-title');
    output.append(row);
    data.table.cols.forEach((heading)=>{
        const cell = document.createElement('h1');
        cell.textContent = heading.label;
        row.append(cell);
    })
    const container = document.createElement('me-row');
    data.table.rows.forEach((main)=>{
        output.append(container);
        console.log(main.c);
        main.c.forEach((ele)=>{
            const cell = document.createElement('me-card');
            cell.textContent = ele.v;
            container.append(cell);
        })
    })
    console.log(data);
})
                

Great! now you can see let url and link 'https://docs.google.com/spreadsheets/d/ YOUR_DISPLAY_CSV/gviz/tq?'. Go back to your sheets, and click share. change access to anyone and then click copy link.
See https://docs.google.com/spreadsheets/d/ NEW_YOUR_DISPLAY_CSV/edit?usp=sharing. Paste your link without red text.
Looks like this :

let url = 'https://docs.google.com/spreadsheets/d/NEW_YOUR_DISPLAY_CSV/gviz/tq?';
                

Run your project...!
No display? Enable apache & mysql on xampp
Buy me coffee?