Este projeto faz parte do bootcamp da Laboratoria.
A aplicação simula o sistema de pedidos de um restaurante. Foi iniciado com o Create React App.
A página da aplicação pode ser acessada atraves do Link: Burger Queen
Um pequeno restaurante de hambúrgueres, que está crescendo, necessita uma interface em que se possa realizar pedidos utilizando um tablet, e enviá-los para a cozinha para que sejam preparados de forma ordenada e eficiente.
O Product Owner nos apresentou este backlog que é o resultado do seu trabalho com o cliente até hoje.
Eu como cliente quero poder anotar o meu pedido saber o valor de cada produto e poder enviar o pedido para a cozinha para ser preparado.
O que deve acontecer para satisfazer as necessidades do usuário?
- Anotar o nome e mesa.
- Adicionar produtos aos pedidos.
- Excluir produtos.
- Ver resumo e o total da compra.
- Enviar o pedido para a cozinha (guardar em algum banco de dados).
- Funcionar bem e se adequar a um tablet.
Eu como chefe de cozinha quero ver os pedidos dos clientes em ordem, poder marcar que estão prontos e poder notificar os garçons/garçonetes que o pedido está pronto para ser entregue ao cliente.
- Ver os pedidos à medida em que são feitos.
- Marcar os pedidos que foram preparados e estão prontos para serem servidos.
- Ver o tempo que levou para preparar o pedido desde que chegou, até ser marcado como concluído.
Eu como garçom/garçonete quero ver os pedidos que estão prontos para entregá-los rapidamente aos clientes.
- Ver a lista de pedidos prontos para servir.
- Marque os pedidos que foram entregues.
- Os dados devem ser mantidos intactos, mesmo depois que um pedido terminado. Tudo isso para poder ter estatísticas no futuro.
Eu como funcionário do restaurante quero entrar na plataforma e ver apenas a tela importante para o meu trabalho.
O que deve acontecer para satisfazer as necessidades do usuário?
- Criar login e senha.
- Criar tipo de usuário (cozinha / salão).
- Entrar na tela correta para cada usuário.
O principal objetivo de aprendizagem desse projeto foi aprender a construir uma interface web usando React. Com esse framework foi possível manter a interface sincronizada com o estado. Portanto, foi possível que cada mudança no estado refletisse na interface (por exemplo, toda vez que adicionamos um produto para um pedido, a interface atualiza a lista de pedidos e o total).
A lógica do projeto foi implementada em JavaScript (ES6 +).
O aplicativo é um Single Page App, com Web Design responsivo.
O UX foi pensado para aqueles que vão receber os pedidos, o tamanho e a aparência dos botões, a visibilidade do estado atual do pedido, etc.
Para rodar a aplicação, é necessário instalar o gerenciador de pacotes NPM.
O aplicativo utilizou npm-scripts e possui start, build e deploy, que são responsáveis por iniciar, empacotar e implantar o aplicativo, respectivamente.
Também é necessário instalar as dependências das ferramentas utilizadas:
- React Hooks para o desenvolvimento;
- React-router-dom;
- Aphrodite como framework para o CSS;
- Firebase Hosting e Firestore para hospedagem e banco de dados.