Enrique Teles, enriqueteles
Marcus Pará, MarcusMedeiros99
Mathias Fernandes, Math-O5
***Pet Shop Online é um site desenvolvido utilizando HTML5, CSS3, React e Nodejs. O intuito foi aplicar conceitos de desenvolvimento web e UX Design – User experience - para prática-los. No site, foram desenvolvidas funcionalidades que pudessem gerar uma interface entre o pet shop que vende produtos e serviços e os clientes. Assim, criamos essas duas seções principais, que permite administradores púbicarem e modificarem serviços e produtos, enquantos os clientes, ao cadastrarem-se, podem comprar, adicionar ao carrinho, cadastrar pets e agendar serviços. Outras funcionalidades adjacêntes também foram implementadas. A seguir uma descrição técnica.
Prototipo em Html e Css. Veja aqui: Backend
Estrutura backend: Backend Implementação do frontend em React e do backend em Nodejs e mongooose. Seguida da integração de ambos.
Para executar o servidor entre no backend/README.md. Para executar oa aplicação entre em frontend/README.md
Ao entrar na HOME, o usuário entrar e pode ver os proutos, lista-los, filtra-los, adiciona-los ao carrinho, agendar um serviço, adicionar pets e editar o perfil.
| Cliente | Home | About | Login | Produtos | Serviços | Perfil | Carrinhos | Pets | Relatório |
|---|---|---|---|---|---|---|---|---|---|
| Público | V | V | Re | V | V | ❌ | ❌ | ❌ | ❌ |
| Usuário | V | V | Entrar | V/C | V/Ag | V/E | V/E/R | V/E/A/R | ❌ |
| Admin | V | V | V/A/E/R | V/A/E/R | V/A/E/R | V/A/R | V/R | V/R | V |
| Legenda |
|---|
| V : Ver |
| A : Adicionar |
| E : Editar |
| R : Remover |
| C : Comprar |
| Ag : Agendar> |
| Re : Registrar-se> |
| ❌ : não disponivel |
Informações salvas no banco de dados e a relação entre elas.
- Produtos
- id
- nome
- foto
- Marca : Marca
- typeofPet : string
- preço : double
- quantidVendia : int
- Serviços
- id
- nome
- preço : double
- detalhes : string
- maximoSlot : int
- Reserva
- id
- Client
- Slot
- Pet
- Servico
- Client
- id
- nomeCompleto
- login
- password
- foto
- telefone
- nascimento email
- endereço
- cartaoDeCredito
- lista : Pet
- Carrinho
- Pet
- Client
- id
- nome
- descrição
- raça
- nascimento
- Marcas
- id : int
- nome : string
- descricao : string
- Carrinho
- Produto : array
- quantidade : int
- pendente : boolean
- Slot
- data : string
- hora: int
- min: int
Assets Todas as pastas com arquivos estaticos, isto é, imagens, css e fonts.
CSS Todos arquivos de estilo estão nessas pastas
public/ Todos arquivos que são renderizados em mais de uma página, como header, footers e etc.
product/product.html Todos produtos, permite filtragem por animal, marca e tipo de produto.
service/service.html Todos os serviços, permite filtragem e redireciona para cada serviço.
perfil/perfil.html Tela principal perfil do usuário.
perfil/pets.html Todos pets cadastrados pelo usuário. Permite cdastro de novos pets.
perfil/carrinho.html Todos os produtos adicionados pelo usuário. Permite a comprar do carrinho.