
Countdown-Timer (React, Sass/Scss, Flexbox, JavaScript, Responsive)
Design comparison
Solution retrospective
Although I managed to implement the flip animation, I felt I could of done it a little bit better. So I was wondering how everyone else implemented this? Did you do it by plain CSS or a library? Also how do you think I could improve the animation I have?
Any sort of feedback would be much appreciated, Thank you!
Community feedback
- @elaineleungPosted over 2 years ago
Hi David, well done in building this project in React, which seems to work quite well to me! The only comment I have is that, when the numbers switch to the next time unit (e.g., counting down from the "01" second mark), I think it should be showing zero. For instance, after "01" in the seconds column, I would expect to see "00", but instead I see "60". In short, I suggest that the range should be from 0 to 59, not 1 to 60.
As for other solutions, I really like what Curtis did his solution, and even though it's a plain JS solution and not in React, I think it's still a good reference, so check it out here: https://www.frontendmentor.io/solutions/responsive-countdown-timer-made-using-vanilla-js-sass-3wnMC395Zn
Marked as helpful0@David-Henery4Posted over 2 years ago@elaineleung Hi Elaine, thanks for the feedback, that's a great spot on the "00" on the timer! I will definitely implement that into the project. I'll check out Curtis' solution for help and reference on the animations.
Again Thanks for the feedback, very much appreciated, Thank you!
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord