react-fast-hooks

These hooks aim to simplify state management, side effects, and other common functionalities in React applications, improving both productivity and code quality.

Features

🚀 Lightweight and Fast

• Designed to be minimal in size, ensuring your application remains performant and fast.

🌐 SSR-Friendly

• Built with Server-Side Rendering (SSR) compatibility, making it perfect for Next.js.

📝 Typed with TypeScript

• Full TypeScript support, including comprehensive type definitions.

🌲 Tree Shaking Support

• Optimized for tree shaking, ensuring only the code you use is included in your final bundle.

🌍 Cross-Browser Compatibility

• Ensures consistent behavior across all major browsers.

🔧 Ease of Use

• Designed with simplicity and ease of integration in mind.

Installation

npm install react-fast-hooks

Documentation

For more detailed documentation and live code editor visit the website.

Hooks Available

• useBattery - A hook to get the battery status of the device.
• useClickOutside - A hook to detect clicks outside a specified element.
• useClipboard - A hook to copy text to the clipboard.
• useCookie - A hook to manage browser cookies.
• useDebounce - A hook to debounce a value.
• useDebouncedCallback - A hook to debounce a callback.
• useDeviceOrientation - A hook to get the device orientation.
• useDimensions - A hook to get the dimensions of an element.
• useEventListener - A hook to add an event listener to a target.
• useFavicon - A hook to change the favicon of the page.
• useFetch - A hook to fetch data.
• useFocusBlur - A hook to detect focus and blur events.
• useGeolocation - A hook to get the geolocation of the device.
• useHistory - A hook to manage the browser history.
• useHover - A hook to detect hover events.
• useIdle - A hook to detect when the user is idle.
• useIntersectionObserver - A hook to observe an element's intersection with the viewport.
• useKeyCombo - A hook to detect key combinations.
• useKeyPress - A hook to detect key presses.
• useLocalStorage - A hook to manage local storage.
• useLongPress - A hook to detect long presses.
• useMediaQuery - A hook to detect media queries.
• useMouse - A hook to get the mouse position.
• useMutationObserver - A hook to observe mutations on an element.
• useNotification - A hook to show notifications.
• useOnlineStatus - A hook to detect online status.
• usePreferredLanguage - A hook to get the preferred language of the user.
• usePrevious - A hook to get the previous value of a state.
• useRandomColor - A hook to generate a random color.
• useScript - A hook to load an external script.
• useScrollIntoPosition - A hook to scroll an element into view.
• useScrollLock - A hook to lock scrolling.
• useScrollPosition - A hook to get the scroll position.
• useSessionStorage - A hook to manage session storage.
• useSound - A hook to play sounds.
• useStopwatch - A hook to create a stopwatch.
• useSystemTheme - A hook to get the system theme.
• useTitle - A hook to set the document title.
• useTouch - A hook to detect touch events.
• useTouchSwipe - A hook to detect touch swipe events.
• useUpdateEffect - A hook to run an effect only on updates.
• useVibration - A hook to vibrate the device.
• useWindowFocus - A hook to detect window focus.
• useWindowScrollIntoPosition - A hook to scroll the window to a position.
• useWindowScrollPosition - A hook to get the window scroll position.
• useWindowSize - A hook to get the window size.
• useWindowTouchSwipe - A hook to detect window touch swipe events.

Contributing

Contribution guidelines coming soon.