Início Profile Projeto
Avatar de

Cristian da Rosa Melo

Focus Time

  • HTML
  • Javascript
  • CSS
  • ES6 Modules
  • GitHub
🇺🇸 English (apenas no GitHub)
🇧🇷 Português


Focus Time

Esta é uma aplicação de pomodoro timer 🍅, forked do colega de profissão Luis Machado com opções de sons de fundo ambiente para te ajudar a focar com o cenário que achar conveniente.

🔨 Recursos do projeto

Usar a combinação do pomodoro e uma música leve traz consigo uma série de benefícios para a mente, a alma e o coração. Quando essas duas formas de expressão se unem, criam uma sinergia única que amplifica o impacto emocional e proporciona uma experiência enriquecedora.

Entenda a funcionalidade do app:

  • Play : aciona o timer;
  • Stop : para o timer;
  • + : aumenta em mais 5 minutos o tempo do timer;
  • - : diminui em 5 minutos o tempo do timer.
  • Cards ao lado direito: quando selecionado, muda de cor e começa a tocar o som específico, além disso o volume pode ser controlado pelo slide que está embaixo de cada ícone.
  • Botão no canto superior direito: É ali que você vai alternar entre o Dark Mode e o Light Mode.

Texto de funcionalidade do app copiada de Luis Machado.

⚙️ Técnicas e tecnologias usadas

Confira essa lista de tudo que vamos usar nesse app:

  • HTML
  • CSS
  • Javascript
  • ES6 Modules

🛠️ Abra e execute o projeto

Para abrir e executar o projeto, execute npm i para instalar as dependências e npm run dev para iniciar o projeto.

Em seguida, vá para http://localhost:3000/ em seu navegador.

📚 Mais informações do tutorial

Estava eu navegando no Github, e me deparei com esse projeto com design incrível e funcionalidade bacana. Como gosto de programar às vezes com um background tranquilo e adicionalmente gosto da metodologia do pomodoro, achei o projeto perfeito para forkar do Luis Machado. Não obstante, como estou evoluindo como programador, pensei em usar esse projeto como teste para eu editar código de outros programadores, dar manutenção e implementar features. Estou criando novos cards com background sounds que acho conveniente, e o propósito assim que surgir gaps de time, continuar implementando outros tipos de cards de background! O figma do projeto disponível nesse link.

📝 Licença

Esse projeto está sob a licença MIT. Veja o arquivo LICENSE para mais detalhes.

🪧 Vitrine.Dev
Nome Focus Time
🏷️ Tecnologias HTML, Javascript, CSS , ES6 Modules, GitHub (tecnologias utilizadas)
🚀 URL https://js-app-focus-time-f6nait2yk-cristianmeelo.vercel.app/
🔥 Desafio https://github.com/luizgmachado/FocusTime