Preview

Z Store é uma aplicação web de e-commerce moderna construída com React, TypeScript e Vite. Ela oferece uma experiência de compra fluida com recursos como navegação de produtos, gerenciamento de carrinho e checkout seguro.

Detalhes do produto

Produto

Carrinho

Checkout

Recursos

• Catálogo de produtos com páginas detalhadas
• Funcionalidade de carrinho de compras
• Autenticação de usuário (cadastro, login, logout)
• Design responsivo para diversos tamanhos de tela
• Suporte ao modo escuro
• Processo de checkout

Tecnologias Utilizadas

• React
• TypeScript
• Vite
• Tailwind CSS
• Radix UI
• React Router
• Formik e Yup para manipulação e validação de formulários
• Axios para requisições de API
• JSON Server para backend simulado

Começando

1. Clone o repositório
2. Instale as dependências:

   npm install
   

3. Inicie o servidor de desenvolvimento:

   npm run dev
   

4. Inicie o servidor de backend simulado:

   npm run server
   

Estrutura do Projeto

• /src: Diretório principal do código fonte
  • /components: Componentes React reutilizáveis
  • /hooks: Hooks React personalizados
  • /interfaces: Interfaces TypeScript
  • /lib: Funções utilitárias
  • /network: Configuração do cliente API
  • /pages: Componentes de página principais
  • /routes: Definições de rotas

Componentes Principais

• Cabeçalho: Contém elementos de navegação e carrinho
• Cartão de Produto: Exibe informações individuais do produto
• Carrinho: Gerencia a funcionalidade do carrinho de compras
• Página de Checkout: Lida com o processo de checkout

Autenticação

O projeto utiliza um sistema de autenticação personalizado com a API de contexto.

Integração de API

As requisições de API são feitas usando Axios.

Estilização

O projeto utiliza Tailwind CSS para estilização, com configuração de tema personalizada.

Contribuindo

Contribuições são bem-vindas! Sinta-se à vontade para enviar um Pull Request.

Licença

Este projeto é de código aberto e está disponível sob a Licença MIT.