Desenvolvendo um temporizador de tempo para aplicação do método pomodoro.
O projeto foi desenvolvido a partir do Stage 5 do Programa Explorer da Rocketseat 🚀.
O desafio proposto era o desenvolvimento de um temporizador para a aplicação do método Pomodoro utilizando os conhecimentos adquiridos durante as aulas do stage 5.
É uma técnica de gestão do tempo, desenvolvido pelo italiano Francesco Cirillo no final dos anos 80. Enquanto estudante Francesco desenvolveu o método como uma forma de melhorar seu rendimento nos estudos da faculdade. Com a ajuda de um timer em formato de tomate (pomodoro em italiano) ele iniciou seus estudos pausando o tempo de acordo com o timer. A técnica acabou por se revelar uma ótima metodologia para a gestão do tempo, baseando-se na ideia de que, dividir o fluxo da atividade em blocos a concentração será melhor e mais intensa. O método funciona em ciclos, 25 minutos de foco e concentração na atividade a ser desenvolvida, após esses 25 minutos, deve ser realizado um intervalo de pelo menos 5 minutos para relaxar. Após o intervalo a atividade deve ser retomada novamente com concentração e foco total na atividade. Ess ciclo deve ser repetido até a conclusão da atividade. É a partir dessa ideia que foi desenvolvido o temporizador Pomodoro.
Para o controle do temporizador temos os botões play, pause, adicionar mais 5 (cinco) minutos e decrementar 5 (cinco) minutos
-
: play / pause - aciona
e para o timer -
: stop/ set - adiciona o tempo
a ser contato e reseta o tempo ao início -
: aumenta mais cinco minutos -
: diminui cinco minutos
Os cards ao lado do timer emitem sons quando clicados e o som pode ser controlado por meio da barra logo abaixo deixando com ou sem volume.
O temporizador Pomodoro é responsivo sendo possível acessá-lo do smartphone ao desktop. E também apresenta a funcionalidade tema escuro.
-
HTML
-
CSS
-
Javascript
-
funções callback
-
Injeção de dependências
-
Padrão factory
-
Adicionar som com o javaScript
-
Módulos no Javascript
Nesse projeto foi utilizado o conceito de modularização do javascript.
Uma aplicação que começa muitas vezes com poucas linhas de códigos pode alcançar um aumento considerável nessas linhas com a implementação de funcionalidades, por exemplo. Ou seja, uma aplicação pode terminar com muito mais linhas de códigos do que quando começou e tornar a manutenção desse código, uma tarefa díficil, que pode levar horas ou dias para sua conclusão.
A partir do ES6 foi possível dividir o código em arquivos separados, com o objetivo de facilitar a manutenção desse código e dividir as funcinalidades em arquivos que podem ser acessados por meio das instruções import e export.
🖱️ O projeto finalizado pode ser acessado através do link: https://mayaradias.github.io/pomodoro/
- https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Guide/Modules
- https://www.w3schools.com/react/react_es6_modules.asp
- livro: A técnica Pomodoro: O sistema de gerenciamento de tempo que transformou o modo como trabalhamos - Francesco Cirillo.