Este é um aplicativo simples de Pomodoro desenvolvido como parte da formação Desenvolva aplicações Web com JavaScript na Alura. Ele foi construído em duas partes: a primeira parte foi concluída durante o curso JavaScript: manipulando elementos no DOM, enquanto a segunda parte foi realizada no curso JavaScript: explorando a manipulação de elementos e da localStorage.
O objetivo principal deste projeto é aplicar os conceitos aprendidos nos cursos, incluindo manipulação do DOM, eventos, lógica de programação em JavaScript, localStorage, estado entre sessões e persistência de dados
Durante a primeira parte do curso, foram abordados tópicos como manipulação de elementos no DOM e eventos, permitindo a construção de uma base funcional para o aplicativo. Na segunda parte, a ênfase foi na exploração da localStorage para armazenar o estado do aplicativo entre sessões, garantindo que os dados do usuário fossem mantidos mesmo após o fechamento do navegador.
Combinando os conhecimentos adquiridos em ambas as partes do curso, foi possível criar uma aplicação Pomodoro que não só permite ao usuário gerenciar seu tempo de forma eficaz, mas também mantém suas preferências e progresso salvos para futuras sessões de trabalho.
Este projeto faz parte da formação Desenvolva aplicações Web com JavaScript na Alura.
O objetivo principal do projeto é criar um aplicativo de Pomodoro funcional, permitindo aos usuários gerenciar períodos de foco e descanso.
- Contagem regressiva para períodos de foco e descanso.
- Botões para iniciar, pausar e reiniciar a contagem.
- Alternância entre períodos de foco curto e longo, e períodos de descanso.
- Controle de música de fundo durante os períodos de foco.
- Adição e remoção de tarefas.
Durante o desenvolvimento deste projeto, os principais aprendizados em JavaScript incluíram:
- Manipulação do
DOMpara adicionar e remover elementos dinamicamente. - Utilização de
eventospara responder a interações do usuário. - Armazenamento de dados localmente usando o
localStorage. Criaçãoemanipulaçãode elementos HTML dinâmicos.- Utilização eficiente de
seletores CSSpara interagir com elementos HTML. - Resolução de problemas relacionados à gestão de estado em aplicações web, incluindo
manipulação de arrays. - Implementação de estratégias eficientes para a persistência de dados no navegador através do
LocalStorage.
- Faça o download ou clone o repositório.
- Abra o arquivo
index.htmlno seu navegador.
...
Uma versão hospedada deste projeto está disponível aqui.
...
Como estou aprendendo, sugestões e dicas são bem-vindas! Se você encontrar maneiras de melhorar o código ou adicionar funcionalidades, sinta-se à vontade para abrir issues e pull requests.
Desenvolvido por Lucas Reis.
...