can someone suggest me, what i have to do to connect contentful with my ecom site.

i have created a ecom sites in JavaScript. now i want to connect it with contentful. i think i did everything right, but its not working.

here is my main.js file

 const client = contentful.createClient({
// This is the space ID. A space is like a project folder in Contentful terms
space: "bao7ve9vhfk1",
// This is the access token for this space. Normally you get both ID and the token in the Contentful web app
accessToken: "8MOXl3bT6KvbpuTnU65ICHNmKrCThiusXPOqVJ92KHk"

});

  let carts = document.querySelectorAll('.add-cart');

 let products = [ 
  {
    name: "Grey Tshirt",
    tag: "greytshirt",
    price: 15,
    inCart: 0
   },
   {
    name: "Grey Hoddie",
    tag: "greyhoddie",
    price: 20,
    inCart: 0
   },
  {
    name: "Black Tshirt",
    tag: "blacktshirt",
    price: 15,
    inCart: 0
  },
  {
    name: "Black Hoddie",
    tag: "blackhoddie",
    price: 20,
    inCart: 0
  }
 ];

  for(let i=0; i< carts.length; i++) {
carts[i].addEventListener('click', () => {
    cartNumbers(products[i]);
    totalCost(products[i]);
});

}

function onLoadCartNumbers() {

let productNumbers = localStorage.getItem('cartNumbers');
if( productNumbers ) {
    document.querySelector('.cart span').textContent = productNumbers;
}

}

function cartNumbers(product, action) {

let productNumbers = localStorage.getItem('cartNumbers');
productNumbers = parseInt(productNumbers);


let cartItems = localStorage.getItem('productsInCart');
cartItems = JSON.parse(cartItems);



if( action ) {
    localStorage.setItem("cartNumbers", productNumbers - 1);
    document.querySelector('.cart span').textContent = productNumbers - 1;
    console.log("action running");
} else if( productNumbers ) {
    localStorage.setItem("cartNumbers", productNumbers + 1);
    document.querySelector('.cart span').textContent = productNumbers + 1;
} else {
    localStorage.setItem("cartNumbers", 1);
    document.querySelector('.cart span').textContent = 1;
}
setItems(product);

}

function setItems(product) {
// let productNumbers = localStorage.getItem('cartNumbers');
// productNumbers = parseInt(productNumbers);

let cartItems = localStorage.getItem('productsInCart');
cartItems = JSON.parse(cartItems);



if(cartItems != null) {
    let currentProduct = product.tag;

    if( cartItems[currentProduct] == undefined ) {
        cartItems = {
            ...cartItems,
            [currentProduct]: product
        }
    } 
    cartItems[currentProduct].inCart += 1;

} else {
    product.inCart = 1;
    cartItems = { 
        [product.tag]: product
    };
}

localStorage.setItem('productsInCart', JSON.stringify(cartItems));

}

function totalCost( product, action ) {
let cart = localStorage.getItem("totalCost");

if( action) {
    cart = parseInt(cart);

    localStorage.setItem("totalCost", cart - product.price);
} else if(cart != null) {

    cart = parseInt(cart);
    localStorage.setItem("totalCost", cart + product.price);

} else {
    localStorage.setItem("totalCost", product.price);
}

}

async function displayCart() {
let content = await client.getEntries({
content_type: 'ecom'
});

  //.then((response) => console.log(response.time))
  //.catch(console.error)
let cartItems = localStorage.getItem('productsInCart');
cartItems = JSON.parse(cartItems);

let cart = localStorage.getItem("totalCost");
cart = parseInt(cart);

let productContainer = document.querySelector('.products');



if( cartItems && productContainer ) {
    productContainer.innerHTML = '';
    Object.values(cartItems).map( (item, index) => {

        productContainer.innerHTML += 
        `<div class="product"><ion-icon name="close-circle"></ion-icon><img src="./images/${item.tag}.jpg" />
            <span class="sm-hide">${item.name}</span>
        </div>
        <div class="price sm-hide">$${item.price},00</div>
        <div class="quantity">
            <ion-icon class="decrease " name="arrow-dropleft-circle"></ion-icon>
                <span>${item.inCart}</span>
            <ion-icon class="increase" name="arrow-dropright-circle"></ion-icon>   
        </div>
        <div class="total">$${item.inCart * item.price},00</div>`;
    });

    productContainer.innerHTML += `
        <div class="basketTotalContainer">
            <h4 class="basketTotalTitle">Basket Total</h4>
            <h4 class="basketTotal">$${cart},00</h4>

        </div>`

    deleteButtons();
    manageQuantity();
}