we’ll build out our own analog clock by creating a custom SVG, styling it with plain CSS, and animating it with vanilla JavaScript. Included in this project:
- Creating a custom SVG with circle, text, and path elements
- Using requestAnimationFrame to animate the clock performantly
- Converting the project from a functional style to an object oriented stying
- Adding world clocks from different timezones with date-fns and date-fns-tz
🔗 Additional Links 🔗
- HappyHues (color palette): https://www.happyhues.co/
- NodeJS: https://nodejs.org/en/
- ParcelJS: https://parceljs.org/
- NPM package for timezones: https://www.npmjs.com/package/date-fns-tz
- List of timezones: https://en.wikipedia.org/wiki/List_of_tz_database_time_zones