edilanesilva/ecommerce-product-page-main

Página de produto de comércio eletrônico

Produto de comércio eletrônico

Índice

• Visão geral
  • O desafio
  • Captura de tela
  • Links
• Meu processo
  • Construído
  • O que aprendi
  • Desenvolvimento contínuo
• Author

Visão geral

O desafio

Os usuários devem ser capazes de:

• Veja os estados de foco para todos os elementos interativos na página

• Adicionar itens ao carrinho

• Visualize o carrinho e remova itens dele

• Veja o layout ideal para o site, dependendo do tamanho da tela do dispositivo

Captura de tela

Links

• Link

Meu processo

Construído com

• HTML5
• CSS
• Flexbox
• Grade CSS
• JavaScript vanilla

O que aprendi

CSS -> esconde o contador do input number

        input[type="number"]::-webkit-outer-spin-button,
        input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

JS -> Manipução de objeto e array

let shoppingCart = []; 
 
const product = {
            name: "Fall Limited Edition Sneakers",
            price: 125,
            img: "assets/images/image-product-1-thumbnail.jpg",
            }
            shoppingCart.push(product) 

productName.innerHTML = shoppingCart[0].name;

Desenvolvimento contínuo

• Usar funções, passando parâmetros e argumentos
• Máscara e validação de input em formulários
• Usar estruturas de repetição e laços ('while', 'for')

Author

Edilane Silva