Skip to content

Latest commit

 

History

History

26. Recipe

#boraCodar uma receita junina 🌽

Proposta

O objetivo desse desafio é desenvolver uma interface na qual representa uma receita de festa junina, nesse caso, a receita da pamonha. Sendo assim, em uma receita deve conter a apresentação dos ingredientes necessários para que ela seja feita e também seu modo de preparo. Em adição, essa página possui a representação em imagem da receita e também uma breve descrição, além de poder fazer o controle da quantidade de porções dinamicamente.

Resolução

Para a resolução desse desafio super divertido, utilizei o ReactJs e seu incrível hook useState() que me permitiu manipular a quantidade de porções clicando nos botões de aumentar e diminuir passando essa informação por meio de props para outro componente, onde estão organizados os ingredientes. Além disso, foram feitas pequenas validações para que a string esteja de acordo com a quantidade e também há o bloqueio do botão de diminuir a quantidade de porções quando o valor atual da quantidade de porções é 1. Para finalizar, foram adicionados hover effects nos botões mudando sua escala e opacidade, e utilizei dessa vez a lib Phosphor-Icons para importar os ícones.


Aprendizados

  • Aprimoramento de inglês técnico;

  • Utilização de uma nova lib para importar icons.

  • Atributo disabled.

  • Cursor not allowed.

Esse projeto foi desenvolvido com

HTML | CSS | JavaScript | React | Figma | Git | GitHub