Objetivo: criar um aplicativo CodePen.io que seja funcionalmente semelhante a este: https://codepen.io/freeCodeCamp/full/wgGVVX . Cumpra as histórias de usuário abaixo e faça todos os testes para passar. Dê seu estilo pessoal. Você pode usar qualquer combinação de HTML, JavaScript, CSS, Bootstrap, SASS, React, Redux e jQuery para concluir este projeto. Você deve usar um framework frontend (como o React, por exemplo), porque esta seção é sobre o aprendizado de frameworks frontend. Tecnologias adicionais não listadas acima não são recomendadas e usá-las é por sua conta e risco. Estamos procurando dar suporte a outros frameworks frontend como Angular e Vue, mas eles não são suportados atualmente. Aceitaremos e tentaremos corrigir todos os relatórios de problemas que usam a pilha de tecnologia sugerida para este projeto. Codificação feliz! User Story # 1: Minha calculadora deve conter um elemento clicável contendo um = (sinal de igual) com um id="equals" . User Story # 2: Minha calculadora deve conter 10 elementos clicáveis contendo um número cada de 0 a 9, com os seguintes IDs correspondentes: id="zero" , id="one" , id="two" , id="three" , id="four" , id="five" , id="six" , id="seven" , id="eight" e id="nine" . User Story # 3: Minha calculadora deve conter 4 elementos clicáveis, cada um contendo um dos 4 principais operadores matemáticos com as seguintes IDs correspondentes: id="add" , id="subtract" , id="multiply" , id="divide" . História do usuário nº 4: minha calculadora deve conter um elemento clicável contendo um . (ponto decimal) símbolo com um id="decimal" correspondente id="decimal" . História do usuário nº 5: minha calculadora deve conter um elemento clicável com um id="clear" . User Story # 6: Minha calculadora deve conter um elemento para exibir valores com um id="display" . User Story # 7: A qualquer momento, pressionar o botão Limpar apaga os valores de entrada e saída e retorna a calculadora ao estado inicializado; 0 deve ser mostrado no elemento com o id de display . User Story # 8: Como eu insiro números, eu deveria ser capaz de ver minha entrada no elemento com o id de display . User Story # 9: Em qualquer ordem, eu deveria ser capaz de adicionar, subtrair, multiplicar e dividir uma cadeia de números de qualquer tamanho, e quando eu pressionar = , o resultado correto deve ser mostrado no elemento com o ID de display . User Story # 10: Ao inserir números, minha calculadora não deve permitir que um número comece com vários zeros. User Story # 11: Quando o elemento decimal é clicado, a . deve anexar ao valor exibido atualmente; dois . em um número não deve ser aceito. User Story # 12: Eu deveria ser capaz de executar qualquer operação (+, -, *, /) em números que contenham pontos decimais. História do usuário nº 13: Se dois ou mais operadores forem inseridos consecutivamente, a operação realizada deve ser o último operador inserido. User Story # 14: Pressionando um operador imediatamente após = deve iniciar um novo cálculo que opera no resultado da avaliação anterior. User Story # 15: Minha calculadora deve ter várias casas decimais de precisão quando se trata de arredondamento (note que não existe um padrão exato, mas você deve ser capaz de lidar com cálculos como 2 / 7 com precisão razoável para pelo menos 4 casas decimais) . Nota Na lógica da calculadora: Deve-se notar que existem duas principais escolas de pensamento na lógica de entrada da calculadora: lógica de execução imediata e lógica de fórmula . Nosso exemplo utiliza lógica de fórmula e observa a ordem de precedência de operação, a execução imediata não. Qualquer um é aceitável, mas observe que, dependendo de qual escolher, sua calculadora pode produzir resultados diferentes dos nossos para certas equações (veja o exemplo abaixo). Contanto que sua matemática possa ser verificada por outra calculadora de produção, por favor, não considere isso um bug. EXEMPLO: 3 + 5 x 6 - 2 / 4 =

Lógica de Execução Imediata: 11.5
Fórmula / Expressão Lógica: 32.5

Você pode criar seu projeto, bifurcando essa caneta CodePen . Ou você pode usar este link CDN para executar os testes em qualquer ambiente que desejar: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js Quando terminar, envie a URL para o seu trabalho. projeto com todos os seus testes passando. Lembre-se de usar o método Read-Search-Ask se você ficar preso.