scrollytelling
react-cool-inview
scrollytelling | react-cool-inview | |
---|---|---|
1 | 1 | |
1,012 | 1,461 | |
3.4% | - | |
8.7 | 3.9 | |
3 months ago | 9 months ago | |
TypeScript | TypeScript | |
GNU General Public License v3.0 or later | MIT License |
Stars - the number of stars that a project has on GitHub. Growth - month over month growth in stars.
Activity is a relative number indicating how actively a project is being developed. Recent commits have higher weight than older ones.
For example, an activity of 9.0 indicates that a project is amongst the top 10% of the most actively developed projects that we are tracking.
scrollytelling
react-cool-inview
-
React Hooks for infinite scroll: An advanced tutorial
As the purpose of this article is infinite loading, weβre not going to go into the implementation details of the Intersection Observer API, and instead use an existing React Hook that provides that functionality for us, react-cool-inview.
What are some alternatives?
codehike - Marvellous code walkthroughs
react-cool-virtual - π β»οΈ A tiny React hook for rendering large datasets like a breeze.
tsParticles - tsParticles - Easily create highly customizable JavaScript particles effects, confetti explosions and fireworks animations and use them as animated backgrounds for your website. Ready to use components available for React.js, Vue.js (2.x and 3.x), Angular, Svelte, jQuery, Preact, Inferno, Solid, Riot and Web Components.
react-intersection-observer - React implementation of the Intersection Observer API to tell you when an element enters or leaves the viewport.
auto-animate - A zero-config, drop-in animation utility that adds smooth transitions to your web app. You can use it with React, Vue, or any other JavaScript application.
react-awesome-reveal - React components to add reveal animations using the Intersection Observer API and CSS Animations.
scrollyteller - A React component for creating scrollyteller stories
svelte-inview - A Svelte action that monitors an element enters or leaves the viewport.π₯
scrollxp - Alpine.js-esque library for scrolling animations on websites
use-local-storage-state - React hook that persists data in localStorage
animate-css-grid - Painless transitions for CSS Grid