Saturday, June 15

Tag: react-scroll

Web Tricks

Implementing Smooth Scrolling in React

Smooth Scrolling, dont know what it is? Well, instead of clicking on a button and being instantly taken to a different part of the (same) page, the user is navigated there via a scroll animation. It's one of those subtle features on a site that makes an incredible difference in terms of aesthetics. I personally just implemented this on one of my personal sites because I love the look and feel it provides to the user. That said, even though smooth scrolling might be subtle, it can be a bit tricky to implement yourself. Because of that, in this article, we are going to use the react-scroll package on NPM. Using react-scroll We'll be building a simple app in this tutorial, but if you want a quick rundown of how react-scroll works: Install react-scroll npm i -S react-scroll Import the ...