Caso o cronometro necessite de precisão, usar o setTimeout para medir o tempo não é a melhor forma. O setTimeout não garante que a função seja chamada exatamente no tempo especificado. Ela pode ser chamada depois caso outra função esteja sendo executada no momento. Chamar o setTimeout dessa forma pode ir acumulando erro a cada segundo. Uma alternativa seria guardar no state a data de início do cronometro usando um Date e a cada iteração calcular o tempo decorrido dessa data. Lembrando que o Date tem precisão de até milissegundo. O setTimeout seria usado apenas para atualizar a interface. O cálculo do tempo decorrido poderia ser feito subtraindo a data de agora com a data de início. Dessa forma mesmo que o setTimeout tenha passado mais de um segundo o tempo decorrido vai refletir exatamente isso. Ele será o tempo exato entre as duas datas. Inclusive com essa alternativa ficaria fácil exibir os milissegundos. Seria só chamar o setTimeout a cada 200 ms, por exemplo e adicionar os milissegundos na interface. Da forma do vídeo não daria para chamar o setTimeout a cada milissegundo pra ir decrementando. Claro que o Diego fez assim pra simplificar, mas só deixando o comentário aqui como curiosidade.
Lembro que nessa NLW eu percebi o mesmo problema, e é pior ainda quando vc vai pra outra aba do navegador O timeout de 1 segundo pra janela em background demorava tipo, bem mais de um segundo, lembro que comparei com o cronômetro do celular e tava perdendo de um a dois segundos a cada 20, mais ou menos Eu fiz desse jeito que vc falou, de salvar o tempo inicial, mas isso acabou dando um outro problema (que eu acabei não conseguindo resolver sem uma gambiarra) O que acontece é que, como o timeout de 1 segundo não executa a cada 1 segundo, tem uma diferença entre a passagem de segundos na atualização da interface e o tempo em si Na interface acabava ficando no mesmo segundo por dois segundos e dps atualizando de uma vez (resolvi isso colocando um valor menor no timeout, tipo, 100ms, pra compensar esse erro, mas isso acaba executando muito mais coisa do que o necessário)
@@adryelbarros3250 desacoplar a parte que atualiza o valor da data para uma função que faça apenas isso, então seu timeout tocará apenas em executar a função e atualizar os valores na tela
Eu não sou nenhum especialista em JS, mas tinha pensado isso também. Logo no começo do vídeo, como eu não estava com o PC, pausei para pensar como eu faria. Eu pensei algo assim; Pegar a data atual com new Date().getTime() que retornaria o valor em ms, então somar com o valor do timer para saber quando a contagem iria terminar. Tendo isso, a cada setTimeout, eu calcularia o estado atual da contagem subtraindo o valor do final da contagem menos o now.
Diego você é um cara excepcional, imagino a felicidade desses programadores em ter você como mentor. As vezes a forma como você fala conta muito pra quem tá começando. E o bom educador não é aquele que chega e fala "faz melhor", mas sim aquele que pega e fala "deixa eu te ensinar como ser melhor". Isso faz toda diferença e por isso te admiro tanto.
Diego eu sou Dev a 10 anos e nunca vi ninguém ensinar da forma que vc ensina, sua didática é muito boa, sempre colocando a mão na massa mesmo, meu primeiro contato com vcs foi agora que o NLW Return indicação de um amigo, e estou achando demais. Parabéns pelo seu trabalho.
Muito legal ter usado fail-first e/ou return-first, isso evita muita cascata de else e diminui muito a complexidade cognitiva, além de evitar a execução de código que seria inútil... Topzera!
uma coisa que passou batido, é sempre importante "limpar" o setTimeout/setInterval que foi invocado no useEffect supondo que o usuário saísse da página de pomodoro faltando 1 min e fosse pra de página perfil, depois de 1 min o timeout executaria o setState que possivelmente já saiu da memória e ocasionaria num erro
Não sei se alguém citou, mas também existe o método Math.trunc(), que ignora as casas decimais e retorna apenas o número inteiro, também iria servir para o exemplo.
Nossa aprendi muito hoje e já parti para 70% 20% 10% criei no expo o CountDown. Algumas vezes queria ter a mente do Diego para me ajudar em horas de sufoco...
Tenho alguns em java e em C, na época em que comecei a programar,. Eram bem pra iniciantes mesmo, gostaria de ver eles na live pra demonstrar como se sairiam hoje.
Eu acho que pra melhorar mais ainda vc teria que ter criado uma variável pra armazenar timeout e qdo o valor chegar a zero vc chamaria clearTimeout com o timeout e tbm no useEffect como clear function (a função q vc retorna no effect). Isso pra garantir q caso o componente seja "desmontado" o timeout tb seja cancelado
Normalmente a única coisa que é válida no cleancode é quando você tem um projeto e as entidades tem nomes específicos. ex: "Person" para "Pessoa". Uma pessoa terá um "CPF" ou "CNPJ" e não há uma tradução global única para esse tipo de sigla ou referência.
Velhos, já sou dev a algum tempo e sempre que preciso de lógicas com timer ou tempo é sempre um quebra cabeça, mas tive uma experiência com timer que precisava de restart do cronometro quando dava refresh da tela ou reiniciava o sistema ou simplesmente minimizava o navegador usando um técnica chamada worker nativa do javascript.
Se vocês tem projetos react native (versões abaixo de 0.60.x) ou flutter em seus macs não instalem o Fig. A principio pareceu lindo e mágico mas com o 2 dias de uso meus projetos começaram a dar problemas na hora que tentava dar build ou start para instanciar no simulador. Gostei das dicas dos outros apps mas esse FIG só me deu dor de cabeça =T
Se alguém puder responder, pq o curso de NodeJS no Ignite é todo feito com classes e não usando paradigma funcional ? To meio que quebrando a cabeça pq fiz vários cursos de NodeJS e todos fizeram API de forma totalmente diferente da feita no Ignite, isso está me deixando confuso.
Porque o IGNITE nao está te passando apenas conhecimento de NodeJs. No IGNITE você tem um curso de programação Orientada objetos, com Solid, TDD entre outros, é completo amigo. Se fosse só para executar métodos com funções não atenderiam para os conceitos acima passados. Na minha opinião é isso e acho fantástico. Aprendi mais do que na minha graduação logo se acostuma!
@@franciscomenezes6970 excelente colocação. No ignite você aprende arquitetura, padrões de projeto, solid, etc. De uma forma que é aplicável no mercado visando maior escalabilidade. Eu sinceramente acho que ele é um ótimo curso.
@@andreaugusto3851 nao quis dizer que é melhor do que uma graduaçao longe disso so quis dar um exemplo para tentar ajudar na sua pergunta, desculpe se não era o que gostaria de ouvir!
você fez uma afirmação muita vaga. Desatualizado em que? Se você por exemplo for um dev js só precisa do node. E sobre quais pacotes? se for os do npm independe do OS que você estiver.
Aí que você se engana, dependendo da sua distribubição linux os pacotes podem estar mais desatualizados ainda... O ponto é que um pacote sempre atualizado pode ser um problema, pois com isso vc perde estabilidade no seu ambiente. Além disso, desenvolver em macos, linux ou windows é só uma questão de preferência na maioria dos casos, exceto para alguns devs que necessitam de um ambiente específico por conta de alguma limitação de OS
Gostaria de saber se vocês pegam pessoas acima dos 50 anos que nunca programou... Ando muito de aplicativo 99 e Uber e todos me perguntam porque não tem pessoas que podem ensinar a programar.
Eu gosto de aprender sozinho porque nao tenho paciencia em assistir video aulas, o diegão e o unico que me prende na tela e assistir seus videos. muito bom conteudo
o problema de usar o setTimeout é que a próxima interacao vai comecar depois que a primeira acaba. entao se o codigo pra reduzir o amount demorar 0.001 segundo, a interacao toda vai ter 1.001 segundo, e nao 1 segundo exato. sei q a diferenca é minima mas como queremos fazer um countdown, o certo sao os 25 segundos serem exatos. o setInterval vai comecar cada interacao exatamente a cada 1 segundo. assim no final dele terao passados exatamente 25 segundos, e nao 25.0025
Nossa como enrolei para assistir isso e no final era super tranquilo kkkk! Valeu pelo vídeo, eu estou nesse ponto de procurar mais sobre como melhorar códigos que já funcionam... Tanto legibilidade, quanto eficiência
ele não esta no google, esta no cubo Itaú, é um local para aceleração de startups e network, semelhante ao Google for startups, não sei como funciona no cubo, mas no google pode ir qualquer um, basta preencher um formulario no site do google for startups