Skip to content

A responsive front-end e-commerce platform for artisans. Developed with vanilla HTML, CSS, and JavaScript. Includes a product gallery, cart, and checkout flow simulation.

Notifications You must be signed in to change notification settings

loguinha/Frontend-Ecommerce-for-Artisans

 
 

Repository files navigation

Frontend de E-commerce para Velas Artesanais (Luarce)

Este repositório contém o código-fonte completo do frontend de um site de e-commerce responsivo, projetado para a marca de velas artesanais "Luarce". O site oferece uma interface limpa e elegante para os clientes navegarem pelos produtos, verem detalhes e gerenciarem seus carrinhos de compras.

Este projeto foi desenvolvido como parte de um trabalho de extensão universitário, utilizando tecnologias web fundamentais como HTML, CSS e JavaScript puro, sem o uso de frameworks externos.

Funcionalidades

  • Design Responsivo: Uma abordagem que prioriza dispositivos móveis garante que o layout se adapte a vários tamanhos de tela, de desktops a smartphones.
  • Vitrines de Produtos: Um catálogo dedicado e páginas de produtos individuais com carrosséis de imagens, descrições detalhadas e pirâmides olfativas.
  • Carrinho de Compras Interativo: Os usuários podem adicionar produtos com opções específicas (como tipo de pavio), ajustar quantidades e ver o preço total ser atualizado dinamicamente. O estado do carrinho é salvo no LocalStorage do navegador.
  • Conteúdo Dinâmico: O JavaScript é usado para gerenciar o catálogo de produtos, o estado do carrinho de compras e elementos interativos como carrosséis de imagens e pop-ups.
  • Fluxo de Compra Completo: Um processo claro e com várias páginas para o checkout, incluindo páginas para seleção de pagamento e confirmação de pedido.

Tecnologias Utilizadas

  • HTML5: Para a estrutura e o conteúdo do site.
  • CSS3: Para toda a estilização, layout (incluindo Flexbox) e responsividade.
  • JavaScript (Vanilla): Para toda a lógica do lado do cliente, interatividade e manipulação do DOM. Nenhum framework ou biblioteca externa de JS foi utilizado.

Como Executar Localmente

Para executar este projeto em sua máquina local, você pode usar um servidor simples.

  1. Clone o repositório:
    git clone [https://github.com/seu-usuario/frontend-ecommerce-for-artisans.git](https://github.com/seu-usuario/frontend-ecommerce-for-artisans.git)
  2. Navegue até o diretório do projeto:
    cd frontend-ecommerce-for-artisans
  3. Se você usa o Visual Studio Code, a maneira mais fácil é instalar a extensão Live Server e clicar em "Go Live" no canto inferior direito. Isso iniciará o projeto em seu navegador.

Estrutura de Arquivos

O repositório está organizado em pastas baseadas nas funcionalidades do site:

├── CARRINHO/ # Página e lógica do carrinho de compras ├── CATEGORIAS/ # Páginas das categorias de produtos ├── CATÁLOGO/ # Catálogo principal de produtos ├── GLOSSÁRIO/ # Página com o glossário de termos ├── HOME/ # Estilos e scripts da página inicial ├── Imagens/ # Todas as imagens, ícones e SVGs ├── PAGAMENTOS/ # Páginas do fluxo de pagamento ├── PEDIDO/ # Página de informações do pedido ├── PRODUTOS/ # Páginas de detalhes dos produtos individuais ├── REGISTRO/ # Páginas de login e cadastro de usuário ├── index.html # A página inicial do site └── README.md # Este arquivo

📄 Licença

Este projeto é de código aberto. Sinta-se à vontade para usá-lo como referência para seus

About

A responsive front-end e-commerce platform for artisans. Developed with vanilla HTML, CSS, and JavaScript. Includes a product gallery, cart, and checkout flow simulation.

Topics

Resources

Stars

Watchers

Forks

Languages

  • HTML 74.6%
  • CSS 20.6%
  • JavaScript 4.8%