Skip to content

Latest commit

 

History

History
43 lines (27 loc) · 1.83 KB

calculadora.md

File metadata and controls

43 lines (27 loc) · 1.83 KB

⇦ Página Inicial - React

Workshop ReactJS - Calculadora

Entregável 1 - Display da calculadora

Criar um componente que tem um input onde é possível digitar apenas números (inteiros e decimais).

Conceitos envolvidos


Entregável 2 - Adição de botões

Criar os botões de digitos da calculadora. Ao clicar nos botões, o display da calculadora deve alterar seu valor.

Conceitos envolvidos


Entregável 3 - Adição de operações

Criar botões de operações e de igual.


Melhorando sua Aplicação

Agora você já sabe o que o React pode te oferecer. Se você quer melhorar sua aplicação. Temos desafios para solidificar seus conhecimentos. Fique à vontade para tentar e aprender mais sobre a plataforma.

Para seguir em frente, é recomendado refatorar sua aplicação seguindo a mentalidade de React. Depois tente fazer alguns desafios.

  • Usar Flux para gerenciar o Estado
  • Usar Redux para gerenciar o Estado
  • Usar componentes prontos do npm para mascarar o input

Desafios

  • Adicione uma toogle de on-off na calculadora, que ao ser clicado, muda a cor do display e dos botões, como se eles estivessem desligados, ao ser ligado novamente, a memória da calculadora deve ser resetada.
  • Adicione um toogle "debug" na calculadora, que ao ser clicado, abre uma área com os dados do state como um JSON formatado para o usuário.