Foi desenvolvido em grupo, com objetivo de treinar as soft skills, metodologias ágeis e revisar as hard skills, uma aplicação de busca de receitas utilizando React.js no paradigma funcional e realizando testes automatizados para garantir a qualidade.
Neste app a pessoa usuária pode pesquisar por receitas de comidas ou bebidas, podendo fazer uma busca por nome da receita, primeira letra e ingredientes que ela utiliza ou selecionar uma categoria. Ao encontrar a receita desejada a pessoa usuária pode ver os detalhes da receita ao clicar sobre o card da receita, na página de detalhes da receita é possível favoritar a receita, compartilhá, e iniciar a receita clicando sobre o botão START RECIPE. Ao iniciar a receita o usuário poderá checar os ingredientes, após checar os ingredientes e clicar no botão FINISH RECIPE será redirecionado para página de receitas feitas.
Este foi o protótipo no Figma utilizado no desenvolvimento.
O layout tem como foco dispositivos móveis, dessa forma todos os protótipos vão estar desenvolvidos em telas menores.
A base de dados são duas APIs distintas, uma de comida e outra de bebida.
- API de comida TheMealDB
- API de bebida TheCocktailDB
- Comunicação
- Colaboração
- Pair programming
- Metodologias ágeis
- Atomic design
- Desenvolvimento orientado a testes
- Context API
- React hooks
-
Clonar o repositorio
git clone [email protected]:RenanFernandess/trybe-project-recipes-app.git -
Entrar na pasta project-recipes-app
cd ./trybe-project-recipes-app -
Instalar pacotes NPM
npm install
-
iniciar o aplicativo
npm startapós o start por padrão você será redirecionado para uma página do seu navegador com a seguinte URL:
http://localhost:3000/
Na página Meals é onde você vai buscar as receitas de comidas, ao clicar sobre o ícone de lupa vai mostrar a barra de pesquisa, onde você pode fazer uma busca por nome da receita, pela primeira letra ou um ingrediente que ela utiliza. Você também pode fazer uma busca por categoria ao clicar sobre alguma das categorias listadas. |
|
Na página Drinks é onde você vai buscar as receitas de bebidas, ao clicar sobre o ícone de lupa vai mostrar a barra de pesquisa, onde você pode fazer uma busca por nome da receita, pela primeira letra ou um ingrediente que ela utiliza. Você também pode fazer uma busca por categoria ao clicar sobre alguma das categorias listadas. |
Na tela de detalhes da receita, você pode adicionar aos favoritos ao clicar sobre ícone de coração, também pode copiar o link da receita ao clicar sobre o ícone de compartilhar. Nesta página você encontrará os ingredientes, instruções, um vídeo da receita e recomendações de bebidas. Para iniciar o preparo da receita basta clicar no botão START RECIPE. |
Na tela de receita em progresso, você pode adicionar aos favoritos e copiar o link assim como na tela detalhes da receita. Nesta página você encontrará os ingredientes com uma caixa de seleção, as instruções e o vídeo da receita, o progresso da receita fica salvo, você busca outras receitas e depois volta para a receita que você estava preparando e continuar onde parou. Ao concluir o preparo da receita selecionando todos os ingredientes o botão FINISH RECIPE será habilitado, ao clicar sobre ele será redirecionado para página de receitas feitas. |
|
