About • Tech Stack • Contact
A aplicação que desenvolveremos é um cardápio digital para um restaurante fictício, conhecido como foodExplorer.
Tecnologias usadas: HTML, CSS, JavaScript, Node.js, React.js
Instruções 1 - É importante que todas as instruções do desafio sejam lidas com muita atenção, já que a avaliação desse projeto, irá garantir a sua certificação aqui no Explorer;
2 - Use o link do Figma como base para o projeto. Também disponibilizamos para download todos os assets necessários;
3 - O link do Figma possui o layout de uma aplicação completa que vai desde a visualização de um prato até o pagamento do mesmo. Algumas funcionalidades mais simples, serão obrigatórias e corrigidas enquanto as funcionalidades envolvendo todo o processo de pedidos, serão classificadas como milha extra, logo, não passarão por uma correção.
4 - O foodExplorer terá duas personas: o administrador e o usuário;
5 - É necessário se autenticar para entrar na aplicação através da tela de login;
6 - O admin é a pessoa responsável pelo restaurante, logo, poderá criar, visualizar, editar e apagar um prato a qualquer momento. Cada prato deve conter uma imagem, um nome, uma breve descrição, os ingredientes e o seu preço. Ao clicar em adicionar prato, o admin receberá uma mensagem de sucesso e será redirecionado para a página principal;
7 - O usuário irá visualizar todos os pratos cadastrados e, quando clicar em um prato, será redirecionado para uma nova tela com informações mais detalhadas sobre ele.
8 - Tanto o admin quanto o usuário poderão buscar os pratos por nome e/ou ingredientes;
Critérios de avaliação
Obrigatórios
Um projeto estruturado, com uma boa organização das pastas, divisão de componentes no front-end, etc;
Os dados do admin, do restaurante e dos usuários serão armazenados em um banco de dados;
Os usuários deverão se autenticar para entrar na aplicação através da tela de login, você pode aplicar o que aprendeu nas aulas de autenticação JWT;
Dê nomes significativos para as suas funções e variáveis: trabalhe um pouco com os conceitos do Clean Code;
Possibilidade de fazer uma busca pelo nome do prato, pelos ingredientes ou por prato favorito;
O admin irá fazer upload de imagens para cadastrar e editar tanto os pratos quanto os ingredientes;
Interessante deixar a aplicação responsiva: utilize o conceito de Mobile First que foi aprendido em aula;
Deixe o código mais acessível e semântico usando as dicas que foram passadas em aula;
Fica a seu critério onde aplicar animações, transições e transformações;
É essencial que a sua interface consuma a sua API;
Para finalizar, faça o deploy da sua aplicação.
Opcionais
O usuário poderá incluir itens no carrinho, clicando no botão incluir. Já a quantidade é controlada pelos botões “-” e “+”;
Ao clicar no botão meu pedido, o usuário será redirecionado para uma tela onde irá ver o seu pedido, a soma e os métodos de pagamento;
O usuário poderá excluir um prato do carrinho e o valor total do pedido deve ser atualizado automaticamente;
O usuário poderá marcar um prato como favorito, basta clicar no coração que aparece ao lado de cada um;
O admin irá visualizar e controlar o status de cada pedido, por um campo do tipo select. Os pedidos irão aparecer em uma tabela ao clicar em Pedidos;
O admin irá visualizar e controlar o status de cada pedido, por um campo do tipo select. Os pedidos irão aparecer em uma tabela ao clicar em Pedidos;
Já que o projeto está em dark mode, você pode aplicar a versão light mode;
Você pode adicionar quaisquer novas funcionalidades no seu projeto. Se desafie.
Boa sorte e boooooora deployar! 🚀
Made with ❤️ by Felipe Cardoso, get in touch!
