AllMart é uma loja virtual desenvolvida utilizando React, Redux, React Router, Tailwind CSS, Vite, Node.JS & Express. O objetivo do projeto é criar uma plataforma de e-commerce simples, com funcionalidades de autenticação, catálogo de produtos, carrinho de compras, e gerenciamento de pedidos.
- Registro e login de usuários
- Autenticação baseada em JWT
- Controle de acesso baseado em funções (Admin/Usuário)
- Rotas protegidas
- Persistência de sessão
- Conta administrador padrão:
- Usuário:
admin - Senha:
admin123
- Usuário:
- Gerenciamento de produtos:
- Criar novos produtos
- Editar produtos existentes
- Excluir produtos
- Visualizar todos os pedidos
- Atualizar status dos pedidos
- Navegar pelo catálogo de produtos
- Adicionar produtos ao carrinho
- Visualizar carrinho
- Atualizar quantidades no carrinho
- Remover itens do carrinho
- Realizar pedidos
- Visualizar histórico de pedidos
- Atualizar informações do perfil
- Listagem de produtos com imagens
- Visualização detalhada de produtos
- Formatação de preços
- Controle de estoque
- Busca e filtragem de produtos
- Funcionalidade de adicionar ao carrinho
- Persistência do carrinho
- Gerenciamento de quantidades
- Cálculo do preço total
- Processo de finalização de compra
- Criação de pedidos
- Histórico de pedidos
- Acompanhamento de status
- Visualização detalhada de pedidos
- React
- Redux para gerenciamento de estado
- React Router para navegação
- Axios para chamadas de API
- Tailwind CSS para estilização
- React Toastify para notificações
- Node.js
- Express.js
- JWT para autenticação
- Armazenamento baseado em arquivos (JSON)
- CORS habilitado
- Morgan para logging
-
Clone o repositório
-
Instale as dependências:
# Instalar dependências do backend cd backend npm install # Instalar dependências do frontend cd ../frontend npm install
-
Inicie o servidor backend:
cd backend npm start -
Inicie o servidor de desenvolvimento frontend:
cd frontend npm start -
Acesse a aplicação:
- Frontend: http://localhost:5173
- API Backend: http://localhost:3001
- POST
/api/auth/register- Registrar novo usuário - POST
/api/auth/login- Login de usuário
- GET
/api/products- Obter todos os produtos - GET
/api/products/:id- Obter produto específico - POST
/api/products- Criar produto (Apenas Admin) - PUT
/api/products/:id- Atualizar produto (Apenas Admin) - DELETE
/api/products/:id- Excluir produto (Apenas Admin)
- GET
/api/orders- Obter todos os pedidos (Apenas Admin) - GET
/api/orders/my-orders- Obter pedidos do usuário - GET
/api/orders/:id- Obter pedido específico - POST
/api/orders- Criar pedido - PATCH
/api/orders/:id/status- Atualizar status do pedido (Apenas Admin)
{
"id": número,
"username": string,
"password": string (criptografada),
"email": string,
"role": "admin" | "user"
}{
"id": número,
"name": string,
"price": número,
"description": string,
"picture": string (URL),
"stock": número
}{
"id": número,
"userId": número,
"items": Array<{
"productId": número,
"quantity": número,
"price": número
}>,
"total": número,
"status": "pending" | "processing" | "completed" | "cancelled",
"createdAt": string (data ISO)
}- Criptografia de senha com bcrypt
- Autenticação com JWT
- Rotas protegidas
- Controle de acesso baseado em funções
- Validação de entrada
- Tratamento de erros
- A aplicação utiliza armazenamento baseado em arquivos para simplicidade
- Todos os dados são armazenados em arquivos JSON no diretório
backend/data - A aplicação cria automaticamente os arquivos de dados necessários na inicialização
- O usuário administrador é criado automaticamente se não existir