⭐ Interactive Rating Component | React | SCSS | Webpack

Community feedback

• 

  I•300

  @igor-ostojicPosted over 2 years ago

  Amazing work, i love the snappy animations !

  1

  ---

  

  bunee•2,020

  @buneeIsSloPosted over 2 years ago

  @igor-ostojic Thanks so much, Igor!

  0
• 

  Mohtashim Ali•510

  @MohtashimAli85Posted over 2 years ago

  Loved the animation part <3 Also code is clean !

  1

  ---

  

  bunee•2,020

  @buneeIsSloPosted over 2 years ago

  @MohtashimAli85 Thanks! Mohtashim :)

  0
• 

  Mohtashim Ali•510

  @MohtashimAli85Posted over 2 years ago

  btw can you give tips regarding seamless animations and anything else :3

  0

  ---

  

  bunee•2,020

  @buneeIsSloPosted over 2 years ago

  @MohtashimAli85 Of course, If you're looking to create animations involving CSS 3D transforms, This website has everything you'll ever need.

  The key to making any animation smooth/seamless is to use easings, and by this, I mean using cubic-bezier instead of the default ease-in or ease-out functions. You can use easings.net to learn more about them.

  CSS animations are great, but they have limitations, so I prefer using third-party libraries like anime.js or GSAP. Personally, I don't have a lot of experience with GSAP, but you give both of them a try and see which one you're comfortable working with.

  I hope this helps :)

  1

  

  Mohtashim Ali•510

  @MohtashimAli85Posted over 2 years ago

  @buneeIsSlo I see. I have tried anime.js looks a bit confusing to me havent used GSAP. How did you learn anime.js ?? thank you so much ^^

  0

  

  bunee•2,020

  @buneeIsSloPosted over 2 years ago

  @MohtashimAli85 Out of the two libraries, anime.js is considered more beginner-friendly. Have you checked out the Documentation? In my opinion, It has some of the most elaborate demos and code explanations. However, I think this video should help as well.

  1