react-use
Essential React Hooks for sensors, UI, animations, side-effects, lifecycles, and state management.
- 30+ sensor hooks track browser APIs and device interfaces including geolocation, keyboard input, scroll position, network state, and device motion
- 9 UI hooks manage audio, video, fullscreen, drag-and-drop, speech synthesis, and click-away detection
- 8 animation hooks provide requestAnimationFrame loops, intervals, timeouts, spring dynamics, and tweening
- 16 side-effect hooks handle async operations, storage, clipboard, debouncing, throttling, and browser APIs like cookies and favicons
- 15 lifecycle hooks extend React's built-in hooks with mount/unmount callbacks, deep comparison effects, and mounted state tracking
- 25+ state hooks simplify management of booleans, arrays, maps, observables, and custom state patterns with history and validation support
react-use
The skill is based on react-use v17.6.0, generated at 2026-01-29.
react-use is a collection of essential React Hooks that provide ready-to-use functionality for common patterns in React applications. It includes hooks for sensors, UI interactions, animations, side-effects, lifecycle management, and state management.
Core References
| Topic | Description | Reference |
|---|---|---|
| Usage | Import patterns and tree-shaking recommendations | core-usage |
Sensors
Sensor hooks listen to changes in browser APIs and device interfaces, forcing components to re-render with updated state.
| Topic | Description | Reference |
|---|---|---|
| useBattery | Tracks device battery status | sensors-battery |
More from hairyf/skills
tailwindcss
Tailwind CSS utility-first CSS framework. Use when styling web applications with utility classes, building responsive designs, or customizing design systems with theme variables.
1.7Khairy-utils
Comprehensive skills for working with @hairy/utils core utilities
891motion
Motion animation library for JavaScript, React and Vue. Use when creating animations, gestures, layout transitions, scroll-linked effects, or working with motion values and animation controls.
763next
Next.js framework for building React applications with App Router, Server Components, and optimized performance. Use when working with Next.js apps, routing, data fetching, caching, Server Actions, or building full-stack React applications.
714valtio
Valtio proxy state management for React and vanilla JavaScript. Use when creating reactive state, managing application state, or working with proxy-based state management.
636valtio-define
Comprehensive skills for working with valtio-define
615