Contentful logo

Contentful Community

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

i think i have messed up the coding

here are my codes…

 * const client = contentful.createClient({    space: "mySpaceKey",  });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));
    
  • } 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();
    
  • }
    
  • }