npm i @uidotdev/usehooks
It’s dangerous to go alone! Master React by learning how to build useHooks yourself.
Delay the execution of function or state update with useDebounce.
Store, retrieve, and synchronize data from the browser’s localStorage API with useLocalStorage
Track the dimensions of the browser window with useWindowSize.
Track the previous value of a variable with usePrevious.
Track and manage the visibility of your DOM elements within the viewport with useIntersectionObserver.
Monitor and adapt to network conditions seamlessly with useNetworkState.
Subscribe and respond to media query changes with useMediaQuery.
Manage and respond to changes in device orientation with useOrientation.
Store, retrieve, and synchronize data from the browser’s session storage with useSessionStorage.
Adapt to user language preferences dynamically with usePreferredLanguage.
Fetch data with accurate states, caching, and no stale responses using useFetch.
Automates retries of a callback function until it succeeds with useContinuousRetry
Track document visibility and respond to changes with useVisibilityChange.
There’s no better way to learn useHooks than by building it yourself.
Load and manage external JavaScript scripts with useScript.
Debug renders and improve performance with useRenderInfo.
Identify unnecessary re-renders and monitor update frequency with useRenderCount.
Execute a callback function at a random interval with useRandomInterval.
Create dynamic timers that can be started, paused, or resumed with useIntervalWhen.
Schedule periodic actions like data polling or animations with useInterval.
Temporarily disable scrolling on the document body with useLockBodyScroll.
Create countdown timers using useCountdown.
Determine whether the code is running on the client-side or server-side with useIsClient.
Add, remove, and clear element from a queue data structure with useQueue.
Track whether an element is being hovered over with useHover.
Create delayed actions or timed events using useTimeout.
Please give us your money.
Listen for events on a target element with useEventListener.
Detect and perform actions on key press events with useKeyPress.
Synchronize and update state based on the Map data structure with useMap.
Throttle computationally expensive operations with useThrottle.
Synchronize and update state based on the Set data structure with useSet.
Copy text to the clipboard using useCopyToClipboard.
Track the battery status of a user’s device with useBattery.
Detect user inactivity with useIdle.
A hook to toggle a boolean value with useToggle.
Add undo / redo functionality with useHistoryState.
Access and monitor a user's geolocation (after they give permission) with useGeolocation.
Track when a user navigates away from a webpage with usePageLeave.
The all new interactive way to master modern React (for fun and profit).
Manage complex state objects with useObjectState.
Debug lifecycle events with useLogger.
Dynamically update the title of a webpage with useDocumentTitle.
Differentiate between the first and subsequent renders with useIsFirstRender.
Enable precise control of long-press interactions for both touch and mouse events with useLongPress.
Dynamically update the favicon with useFavicon.
Manage state with default values using useDefault.
Track and manipulate the scroll position of a web page with useWindowScroll.
Effortlessly measure and track your component’s dimensions with useMeasure.
Detect clicks outside of specific component with useClickAway.
Manage and manipulate lists with useList.
Manage a counter value with minimum and maximum limits with useCounter.
Track and retrieve the position of the mouse cursor with useMouse.