Time Tracking Dashboard | Svelte, TS, Sass

Hello everyone!

Coming back to Frontend Mentor after a long gap! I hope this streak continues.

I built this app with Svelte and Typescript bundled with Vite. I prefer Vite over Rollup due to some problems I have faced with Rollup in the past. I used Svelte's neat transition features to add an on load animation to the dashboard. I also used SortableJS to add draggable functionality to the dashboard cards—it's a great little library that does the job right. The number counting-up animations were made with CountUpJS. I tested my utility functions using Jest to get some practice with TDD as well.

This challenge was relatively quite easy to complete, although I did face some minor setbacks when making the styles responsive. It was a great refresher on CSS Grid and Flexbox.

Please check out my solution and leave your comments below! 👇