Tinkertanker Web Dev
GitHub Repository ↗

About

A productivity timer for studying or working using the Pomodoro Technique. The website is built with HTML, CSS and JS. The user is able to start, stop and resume the timer. The user can also choose between the Pomodoro, Short Break, and Long Break timer on the website

Tech Used

  • HTML
  • CSS
  • JavaScript
    • addEventListener()
    • setInterval() and clearInterval()
    • Math functions
    • String functions
    • querySelectorAll() and getElementById()

Development History

  • Create a simple interface with a circle timer with core functions of a Pomodoro like 25 minute Pomodoro timer, 5 minute break, 15 minute break.
  • Asked ChatGPT to help with the visuals of the circle timer countdown.
  • Removed unecessary stuff by AI.
  • Improved the UI and introduced a colour changing background depending on the timer mode.
View example → Source code ↗