Projeto desenvolvido durante o curso Intensivão de JavaScript da HashTag Treinamentos, iniciado em 28/08/2023 e finalizado em 01/09/2023. Trata-se de uma página de vendas de roupas masculinas e femininas, onde o usuário vai poder filtrar, dentre os produtos ofertados:
- todos os produtos;
- produtos masculinos;
- produtos femininos.
Ao clicar no ícone do carrinho que está logo abaixo da imagem de cada produto, este produto será acrescentado a uma lista de produtos selecionados. A lista de produtos "Meu carrinho" poderá ser exibida ao clicar no ícone do carrinho no topo da página, à direita. Os itens desta lista permitem alteração na quantidade (- ou +). Os itens também podem ser removidos da lista. Ao clicar no botão "Finalizar Compra" será aberta uma página para o usuário fazer um cadastro com "Seus Dados" (dados pessoais), "Pagamento e Entrega" (dados do cartão de crédito e endereço de entrega) e a lista de produtos, quantidades escolhidas e o total da compra. Ao clicar no botão "Finalizar Compra" será aberta uma página com todas as listas de itens já comprados, em ordem de data e hora decrescente. A página de finalização da venda é meramente informativa, portanto, não faz comunicação com nenhuma operadora de cartão de crédito.
- Node.js
- HTML / CSS / JavaScript
- Vite.JS
- Tailwind CSS
# Vá para a pasta, via Prompt, onde você costuma salvar os seus projeto. Não crie nenhuma nova pasta, neste momento, que seja
# relacionada a este projeto; o Vite vai se encarregar de criar essa pasta.
# Execute o comando descrito em https://vitejs.dev/guide/. IMPORTANTE: O Node.js já deve estar previamente instalado no seu
# computador! Se ainda não instalou o Node.js, providencie baixar o instalador a partir de https://nodejs.org/en/download,
# conforme o seu sistema operacional. Em seguida, execute o comando:
npm create vite@latest
# Pressione Y e Enter para instalar o pacote.
# Project name: digite um nome para o projeto e pressione Enter. Esta será a pasta onde serão salvos os arquivos do seu
# projeto.
# Package name: pressione Enter.
# Select a framework: selecione Vanilla dentre as opções e pressione Enter.
# Select a variant: selecione JavaScript e pressione Enter.
# Será criada a estrutura-base do seu projeto.
# Siga os comandos indicados na mensagem e pressione Enter após cada comando:
cd "nome do seu projeto"
npm install
npm run dev
# Será exibida uma URL para exibir o conteúdo da página (http://localhost:5173)
# Clonar o repositório. Para que não seja criada uma nova pasta magazineIntensivao dentro da sua pasta deste projeto, você
# pode baixar os arquivos do projeto e descompactá-los dentro da sua pasta do projeto. Ou execute:
git clone https://github.com/scgalves/magazineIntensivao
Sérgio Carlos Guimarães Alves