React Hooks
←Portfolio
  • useLocalStorage
  • useSessionStorage
  • useMediaQuery
  • useClickOutside
  • useHover
  • useKeyPress
  • useKeyCombo
  • useLongPress
  • useWindowSize
  • useScrollPosition
  • useContainerScroll
  • useElementSize
  • useTimer
  • useBattery
  • useGeolocation
  • useTimeZone

React Hooks

A collection of custom React hooks for common use cases. Type-safe, well-tested, and ready for production use.

State Management

useLocalStorage

Persist state in localStorage with automatic synchronization and type safety.

useSessionStorage

Persist state in sessionStorage with automatic synchronization and type safety.

UI & Layout

useMediaQuery

Efficiently handle responsive design with media queries and real-time viewport updates.

useClickOutside

Detect clicks outside of a specified element for dismissible UI components.

useHover

Track hover state of DOM elements with TypeScript support.

useKeyPress

Track keyboard key states with real-time feedback.

useKeyCombo

Handle keyboard combinations and shortcuts with ease.

useLongPress

Handle long press gestures with customizable duration and callbacks.

useWindowSize

Track window dimensions in real-time with TypeScript support.

useScrollPosition

Track window scroll position in real-time with TypeScript support.

useContainerScroll

Track container element scroll position in real-time with TypeScript support.

useElementSize

Track element dimensions in real-time with ResizeObserver.

useTimer

Create flexible timers with pause, resume, and reset functionality.

Device & Hardware

useBattery

Monitor device battery status in real-time.

useGeolocation

Track user's geographic location with real-time updates.

useTimeZone

Access and monitor user's time zone information.