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.
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.