How to use React Spring to animate components

react spring
(Image credit: Matt Crouch)

React Spring can help you with animations, which are notoriously tricky to implement on the web. CSS animations are the best choice, but creating a smooth result, requires careful juggling of classes, durations and events. Throwing a JavaScript framework like React into the mix only complicates things further. 

For animations that rely on user interaction, values can be computed through JavaScript and applied to an element directly. By taking this manual approach, we would need to calculate and apply our own easing to make the animation look more natural. 

Thank you for reading 5 articles this month* Join now for unlimited access

Enjoy your first month for just £1 / $1 / €1

*Read 5 free articles per month without a subscription

Join now for unlimited access

Try first month for just £1 / $1 / €1

Matt Crouch

Matt Crouch is a front end developer who uses his knowledge of React, GraphQL and Styled Components to build online platforms for award-winning startups across the UK. He has written a range of articles and tutorials for net and Web Designer magazines covering the latest and greatest web development tools and technologies.