Este projeto é uma página web que apresenta um produto, o sofá Margot II - Rosé. A página inclui uma imagem do produto, informações sobre o produto e um botão para adicionar o produto à cesta de compras.
Tecnologias | Projeto | Otimização | Layout | Instalação | Como usar | Licença
Esse projeto foi desenvolvido com as seguintes tecnologias:
- HTML e CSS
- JavaScript
- Git e Github
- Figma
- Font Awesome para ícones
- Google Fonts para fontes
O projeto "Sofa Card Page" é um projeto que foi desenvolvido como desafio #2 no boraCodar da Rocketseat. O projeto consiste em uma página de venda com um sofá Margot II - Rosé, onde a página exibe um botão de view 360º para analisar melhor os detalhes do sofá.
- Utilizado CSS Grid e Flexbox para organizar a estrutura da página.
- Utilizado variáveis CSS para definir cores, fontes e tamanhos.
- Utilizado o atributo srcset da tag img para carregar imagens otimizadas para diferentes tamanhos de tela.
- Utilizado o atributo async ou defer para carregar scripts de forma assíncrona.
- Utilizado uma ferramenta de minificação para reduzir o tamanho do código HTML, CSS e JS.
- Utilizado uma ferramenta de pré-processamento para escrever CSS de forma mais eficiente e organizada.
Você pode visualizar o layout do projeto através DESSE LINK. É necessário ter conta no Figma para acessá-lo.
- Faça o clone do repositório: git clone https://github.com/euvitordev/sofa-card-page.git.
- Entre na pasta do projeto: cd -sofa-card-page.
- Abra o arquivo index.html no seu navegador.
- Clique no botão "ADICIONAR À CESTA" para adicionar o produto à cesta de compras.
- Clique no botão com ícone de street-view para alternar entre a visão geral e a visão detalhada do produto.
Este projeto foi desenvolvido por Vitor Lucas
Se tiver alguma dúvida ou sugestão, entre em contato através do Entre em contato.
Instagram | Github | LinkedIn | Youtube | Discord
Feito com ❤ por Vitor Lucas