I built a simple clock using vanilla Javascript and canvas. What was fun about this mini project was the concept and the organization.

The concept is three concentric circles: seconds at the center, then minutes, then hours. Each time unit is bound by its "parent" – seconds can never exceed the radius of minutes, nor minutes of hours. This was fun to play with.

The organization of the Javascript file mimics that of React – storing state in a singular object. Each function has a singular purpose. If we wanted to be more React-y/functional, we could return a new state rather than modifying the original. (I also have a list of other things one could "do next" in the readme.)

You can see it in action here (note: it only works in Chrome because of the input I used ;) ) and view the source code here.

03 Dec 2016