Sistema completo de e-commerce com backend Spring Boot e frontend em JavaScript vanilla, incluindo autenticação, gerenciamento de usuários, catálogo de produtos e processamento de pedidos.
- Sobre o Projeto
- Funcionalidades
- Tecnologias Utilizadas
- Pré-requisitos
- Como Executar
- Estrutura do Projeto
- API Endpoints
- Credenciais de Teste
- Capturas de Tela
- Autor
Sistema de e-commerce full-stack desenvolvido com Spring Boot no backend e JavaScript vanilla no frontend. O projeto implementa um sistema completo de loja online com autenticação de usuários, gerenciamento de produtos, carrinho de compras e processamento de pedidos.
- ✅ Autenticação e Autorização - Sistema de login com roles (Admin/Cliente)
- ✅ Gerenciamento de Usuários - CRUD completo para administradores
- ✅ Catálogo de Produtos - Visualização de produtos com imagens e preços
- ✅ Carrinho de Compras - Adicionar, remover e ajustar quantidades
- ✅ Processamento de Pedidos - Criação e visualização de pedidos
- ✅ Dashboard Administrativo - Estatísticas e métricas do sistema
- ✅ Interface Moderna - Design responsivo com tema dark e glassmorphism
- 📊 Dashboard com estatísticas (usuários, produtos, pedidos, receita)
- 👥 Gerenciamento completo de usuários (criar, editar, excluir)
- 📦 Visualização de todos os produtos
- 🛒 Criação de pedidos para qualquer cliente
- 📋 Visualização de todos os pedidos do sistema
- 🔐 Login e registro de conta
- 🛍️ Navegação pelo catálogo de produtos
- 🛒 Carrinho de compras funcional
- ✅ Criação de pedidos
- 📜 Visualização dos próprios pedidos
- Java 17
- Spring Boot 3.x
- Spring Web
- Spring Data JPA
- Spring Boot DevTools
- H2 Database (em memória para desenvolvimento)
- Maven (gerenciamento de dependências)
- HTML5
- CSS3 (com variáveis CSS e animações)
- JavaScript ES6+ (Vanilla JS, sem frameworks)
- Fetch API (comunicação com backend)
- REST API (comunicação frontend-backend)
- CORS configurado para desenvolvimento local
- MVC Pattern no backend
- Component-based no frontend
Antes de executar o projeto, você precisa ter instalado:
-
Java Development Kit (JDK) 17 ou superior
-
IntelliJ IDEA (Community ou Ultimate)
- Download: https://www.jetbrains.com/idea/download/
-
Maven (geralmente já vem com IntelliJ)
-
Navegador Web Moderno (Chrome, Firefox, Edge, Safari)
git clone <url-do-repositorio>
cd WebServiceProject- Abra o IntelliJ IDEA
- File → Open
- Selecione a pasta
WebServiceProject - Aguarde a indexação e download das dependências
- Localize
WebServiceProjectApplication.java - Clique com botão direito → Run
- Aguarde até ver:
Started WebServiceProjectApplication - Backend rodando em:
http://localhost:8080
- Navegue até a pasta
frontend - Abra
login.htmlno navegador - Ou use Live Server (VS Code) para melhor experiência
- Admin:
johann@gmail.com/johann - Cliente:
maria@gmail.com/12345
📖 Documentação completa: Veja COMO_EXECUTAR.md
WebServiceProject/
├── src/
│ └── main/
│ └── java/io/github/johann0301/webserviceproject/
│ ├── config/
│ │ ├── CorsConfig.java # Configuração CORS
│ │ └── TestConfig.java # População de dados de teste
│ ├── entities/
│ │ ├── User.java # Entidade Usuário
│ │ ├── Product.java # Entidade Produto
│ │ ├── Order.java # Entidade Pedido
│ │ ├── OrderItem.java # Entidade Item de Pedido
│ │ ├── Category.java # Entidade Categoria
│ │ └── Payment.java # Entidade Pagamento
│ ├── repositories/
│ │ ├── UserRepository.java
│ │ ├── ProductRepository.java
│ │ ├── OrderRepository.java
│ │ ├── OrderItemRepository.java
│ │ └── CategoryRepository.java
│ ├── services/
│ │ ├── UserService.java
│ │ ├── ProductService.java
│ │ └── OrderService.java
│ ├── resources/
│ │ ├── UserResource.java # Endpoints de usuários
│ │ ├── ProductResource.java # Endpoints de produtos
│ │ └── OrderResource.java # Endpoints de pedidos
│ ├── dto/
│ │ └── OrderDTO.java # DTO para criação de pedidos
│ └── WebServiceProjectApplication.java
│
├── frontend/
│ ├── index.html # Interface principal
│ ├── login.html # Página de login
│ ├── app.js # Lógica principal
│ ├── login.js # Lógica de autenticação
│ └── styles.css # Estilos (dark theme)
│
├── pom.xml # Dependências Maven
├── README.md # Este arquivo
└── COMO_EXECUTAR.md # Guia de execução
GET /users- Lista todos os usuáriosGET /users/{id}- Busca usuário por IDPOST /users- Cria novo usuárioPUT /users/{id}- Atualiza usuárioDELETE /users/{id}- Remove usuário
GET /products- Lista todos os produtosGET /products/{id}- Busca produto por ID
GET /orders- Lista todos os pedidosGET /orders/{id}- Busca pedido por IDPOST /orders- Cria novo pedido
GET /categories- Lista todas as categoriasGET /categories/{id}- Busca categoria por ID
- Email: johann@gmail.com
- Senha: johann
| Nome | Senha | |
|---|---|---|
| Maria Silva | maria@gmail.com | 12345 |
| João Santos | joao@gmail.com | 54321 |
| Ana Costa | ana@gmail.com | senha123 |
| Pedro Oliveira | pedro@gmail.com | pedro2024 |
| Julia Ferreira | julia@gmail.com | julia@123 |
O sistema vem pré-populado com:
- ✅ 5 Usuários de teste
- ✅ 15 Produtos com imagens reais
- ✅ 5 Categorias (Eletrônicos, Livros, Computadores, Games, Acessórios)
- ✅ 10 Pedidos com status variados
Interface de login com opções para cliente e administrador.
Estatísticas gerais, usuários recentes e produtos em destaque.
Catálogo de produtos com imagens, preços e botão de compra.
Visualização do carrinho com ajuste de quantidades.
Lista de pedidos com status coloridos e filtros por usuário.
# Backend (IntelliJ)
Run 'WebServiceProjectApplication'
# Frontend
Abrir index.html no navegadorURL: http://localhost:8080/h2-console
JDBC URL: jdbc:h2:mem:testdb
User: sa
Password: (deixe vazio)
- Upload de imagens de produtos
- Sistema de pagamento integrado
- Filtros e busca de produtos
- Avaliações e comentários
- Histórico de pedidos detalhado
- Notificações por email
- Relatórios e gráficos avançados
Johann
- GitHub: @johann0301
Este projeto é de código aberto e está disponível para fins educacionais.
Desenvolvido como projeto de estudo de Spring Boot e desenvolvimento full-stack.
⭐ Se este projeto foi útil para você, considere dar uma estrela!