Este projeto consiste em um site responsivo que simula uma loja de vinhos online. Desenvolvido como parte do módulo avançado de HTML/CSS do curso de Desenvolvimento de Software da IT Step Computer Academy Brasil, o projeto oferece uma navegação intuitiva, páginas específicas para a loja online, galeria de imagens, informações sobre a vinícola, formulário de contato e destaque para revendedores.

• HTML/CSS (Responsivo)
• Bootstrap 5.1.3
• JavaScript
• Simulação de Single Page Application (SPA)

Destacamos uma navbar fixa no topo que permanece visível durante o rolar da página. Em dispositivos móveis, a solução offcanvas é acionada quando a navbar colapsa, garantindo uma experiência suave.

Incluímos um botão estrategicamente posicionado para facilitar o retorno ao início da página, proporcionando uma navegação mais eficiente.

• Loja Online:

  • Paginação personalizada para explorar os produtos.
  • Alerta personalizado confirmando a adição de itens ao carrinho.

• Galeria de Imagens:

  • Permite explorar visualmente o universo da vinícola.

• Sobre Nós:

  • Breve apresentação da equipe ou da história da vinícola.

• Contato:

  • Formulário interativo para facilitar a comunicação.

• Revendedores:

  • Destaque para um formulário específico para potenciais revendedores.

• Exibe produtos adicionados com opções para exclusão e alteração de quantidade.
• Atualização dinâmica do preço.
• Garantia de responsividade utilizando Bootstrap e media queries.

O projeto simula uma SPA usando um único arquivo HTML. Transições suaves entre páginas, efeitos visuais como o efeito "vidro" e um spinner criam uma experiência moderna e cativante.

Você pode acessar visualizar o projeto clicando aqui.

1. Clone este repositório para examinar ou contribuir para o projeto (opcional).
2. Certifique-se de ter as tecnologias mencionadas configuradas no seu ambiente.
3. Abra o arquivo index.html em seu navegador ou utilize um servidor local para visualizar o projeto.
4. Explore as diferentes páginas e funcionalidades do projeto.

Agora o projeto conta com documentação utilizando o JSDoc, que pode ser encontrada na pasta js/out. Para acessar a documentação, abra o arquivo index.html na pasta out em seu navegador.

O projeto implementa o armazenamento local (Local Storage) para o carrinho de compras, garantindo que as informações do carrinho sejam mantidas mesmo após o fechamento do navegador.

Além disso, são aplicadas manipulações de strings em todos os campos para validação no formulário de revenda, garantindo que os dados inseridos sejam formatados corretamente antes do envio.

O projeto faz uso da biblioteca jQuery para simplificar a manipulação do DOM e adicionar interatividade aos elementos da página.

Os offcanvas são utilizados para exibir menus e conteúdos em dispositivos móveis, garantindo uma experiência de navegação intuitiva e responsiva.

A aplicação consome a API ViaCEP para preencher automaticamente os campos de endereço no formulário de revendedores, proporcionando uma experiência mais ágil e conveniente para os usuários.