Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Countdown-Timer (React, Sass/Scss, Flexbox, JavaScript, Responsive)

#react#sass/scss
P
David 960

@David-Henery4

Desktop design screenshot for the Launch countdown timer coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

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

Elaine 11,420

@elaineleung

Posted

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 helpful

0

P
David 960

@David-Henery4

Posted

@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 GitHub
Discord logo

Join 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