| 🇺🇸 English |
| 🇧🇷 Português |
Vídeo | Tecnologias | Sobre | Páginas | Rotas | Clone | Contato
Clique para conferir o vídeo de apresentação no Youtube!
Abaixo estão as 19 principais tecnologias utilizadas no desenvolvimento do projeto
Assistir o vídeo acima ajudará na compreensão da explicação!
Como Cliente, você pode criar uma conta (ou entrar caso você já tenha uma), ver os produtos cadastrados e fazer pedidos. Não tem acesso a funcionalidade e páginas de administradores.
Como Administrador, além de poder fazer tudo o que um usuário pode, ele pode gerenciar a plataforma: adicionando, removendo ou editando pedidos e acessar o histórico de pedidos e controlar o status de cada pedido.
pages/SignUp(/cadastrar): Por essa página o usuário pode criar uma conta;pages/Login(/entrar): Por essa página o usuário pode entrar na sua conta;pages/Home(/): Página que o usuário é redirecionado após criar ou entrar na sua conta. Basicamente, nela o usuário pode ver as categorias de produtos e ir para a página de /produtos já com a categoria clicada selecionada, e também pode ver os produtos em oferta e facilmente fazer um pedido ao ir para a página de /carrinho com o produto clicado já adicionado no carrinho;pages/Products(/produtos): Nessa página o usuário pode ver todos os produtos cadastrados na plataforma, filtrá-los por categoria, e adicioná-los ao carrinho de compras caso queira;pages/Cart(/carrinho): Nessa página o usuário pode ver informações pertinentes sobre a compra, como todos os produtos que estão em seu carrinho, o preço total e a taxa da compra, e também pode aumentar a quantidade de algum produto, e realizar o pedido caso queira;pages/Admin(/gestao): Nessa página, o administrador pode gerenciar a plataforma, adicionando, removendo ou editando pedidos e acessar o histórico de pedidos e controlar o status de cada pedido;
Todas as páginas possuem suas devidas validações e tratamento de possíveis erros.
A lógica utilizada na rotas privadas foi: /cadastrar e /entrar estão disponíveis apenas para usuários que não estão logados, as demais estão disponíveis apenas para usuários logados, e a /gestao está disponível apenas para administradores.
Desenvolvi do zero os componentes que são usados em quase todas as páginas, exceto a /gestao, onde optei por utilizar o MUI.
controllers/UserController(POST: /users): Espera receber os dados necessários para a criação de um usuário (name, email, password, admin), cria um usuário e retorna o novo usuário criado;controllers/SessionController(POST: /sessions): Espera receber os dados necessários para a realização do login do usuário (email, password), e retorna as informações do usuário (e um token);controllers/ProductController:- (POST: /products): Espera receber os dados necessários para a criação de um produto (name, price, category_id, offer, file)), cria um produto, e retorna o novo produto criado, e a lista atualizada com todos os produtos;
- (PUT: /products/:id): Espera receber os dados necessários para a edição de um produto (name, price, category_id, offer, file), edita o produto de id recebido, e retorna o produto atualizado, e a lista atualizada com todos os produtos;
- (DELETE: /products/:id): Espera receber o id do produto a ser delete, deleta tal produto, e retorna o produto deletado;
- (GET: /products): Retorna a lista de produtos cadastrados;
controllers/CategoryController:- (POST: /categories): Espera receber os dados necessários para a criação de uma categoria (name, file), cria uma categoria, e retorna a nova categoria criada;
- (PUT: /categories/:id): Espera receber os dados necessários para a edição de uma categoria (name, file), edita a categoria de id recebido, e retorna a categoria atualizada;
- (GET: /categories): Retorna a lista de categorias cadastradas;
controllers/OrderController:- (POST: /orders): Espera receber os dados necessários para a criação de um pedido (uma lista de objetos com id, quantity), formata a lista de objetos, populando cada objeto com os dados do produto de cada id, cria o pedido, contendo os produtos comprados, o usuário que comprou e o status inicial de order-placed, e retorna o pedido;
- (PUT: /orders/:id): Espera receber o novo status do pedido, atualiza o pedido de id recebido, e retorna o pedido atualizado;
- (GET: /orders): Retorna a lista de pedidos realizados;
Todas as rotas possuem suas devidas validações e tratamento de possíveis erros.
Um middleware para auxiliar na autenticação é usado em quase todas as rotas, exceto na /users e /sessions.
Para clonar e executar este projeto em seu computador, você precisará do Git e Node.js v20.10.0 ou superior previamente instalados.
Feito isso, no terminal:
# Clone esse repositório com:
> git clone https://github.com/Luk4x/codeburger-v2.git
# Entre no repositório com:
> cd codeburger-v2
# Estando agora na raiz do projeto, crie um arquivo `.env`, seguindo o `.env.example` de cada projeto como base.
# Execute o Backend em outro terminal:
> cd backend
> yarn install
> yarn dev
# Execute o Frontend em um terminal:
> cd frontend
> yarn install
> yarn dev
# Feito isso, você já poderá estar acessando o projeto em: http://localhost:5173/
Vitrine.Dev 🪟
|
 Lucas Maciel
|
