React Hooks Community Examples

import { use

Callback

} from 'react'

React Hooks Counter Demo

An example of creating a counter component using React Hooks.

Traffic light using hooks

A switching traffic light that makes use of React Hooks.

useLocalStorage

Sync state to local storage so that it persists through a page refresh. Usage is similar to useState except we pass in a local storage key so that we can default to that value on page load instead of the specified initial value.

React Hooks Animations

Shows how React Hooks can be used with react-spring to create new type of animations.

useState() and useEffect()

An example of using useState() and useEffect()

Cancelable Fetch

A fetch implementation that can be cancelled

useWindowResize

Respond to a window resize event using a hook.

Konami Code

A hook that listens when the Konami code is pressed

Combo Box

An accessible combo box.

Animated Routes

Animated routes using a hook called 'useRouter' and the 'useTransition' hook from react-spring.

Form Hooks

Implementation of a form where the props for the elements are provided with hooks.

Comment System using React Hooks

An example Reddit-like comment system using React Hooks.

Sequence vs Timestep Animations

Using react-spring in combination with hooks to do sequence and timestep animations.

useSpring React Hook

Shows how you can use the useSpring hook and react-spring library to create high-performance interactive animations.

Dialog with React Hooks

Create dialogs using React Hooks.

basic useTransition masonry grid

Using React Hooks in combination with react-spring to create a transition in a masonry grid.

Declarative Intervals

An implementation of setInterval using React Hooks, showing how you can clean up the interval correctly and even how to dynamically change the delay. https://overreacted.io/making-setinterval-declarative-with-react-hooks/