Hooks interview questions

Implement a hook that exposes a boolean value alongside setTrue, setFalse, and toggle helpers.

Implement a hook that fires a callback whenever the user clicks anywhere in the window, cleaning up on unmount.

Implement a hook returning the last copied text and an async copy function built on the Clipboard API.

Implement a hook that exposes a numeric count along with increment, decrement, and reset helpers.

Rewrite useCounter so the returned helpers keep stable identities across renders.

Implement a hook that returns the current value of a sequence and advances to the next on demand.

Implement a hook that steps through an array with wraparound, exposing the current item and next/prev/set.

Implement a hook that falls back to a default value whenever the underlying state becomes null or undefined.

Implement a hook that sets document.title and restores the previous title when the component unmounts.

Implement a hook that runs the given effect a single time after mount, regardless of subsequent renders.

Implement a hook that swaps the page favicon imperatively to a given URL.

Implement a hook that exposes a ref plus a function to focus the attached element on demand.

Implement a hook that reports whether a referenced element is currently being hovered.

Implement a hook that returns true only on the first render and false on every render after.

Implement a hook returning a function that reports whether the component is still mounted, to guard async setState.

Implement a hook that returns a ref always holding the newest value, so callbacks and effects can read it without going stale.

Implement a useState-like hook that persists to localStorage, with SSR-safe init and cross-tab sync.

Implement a hook that holds an object in state and exposes helpers to merge updates or reset its value.

Implement a hook that remembers and returns the value a state held on the previous render.

Implement a hook that counts how many times a component has rendered, without causing extra renders.

Implement a useState-like hook backed by sessionStorage, with a graceful fallback when it is unavailable.

Implement a hook that stores a Set in state and exposes add, delete, has, and clear helpers.

Implement a useState-like hook that also returns a reset function which restores the initial value.

Implement a hook that holds a boolean and returns a stable toggle function to flip its value.

Implement a useEffect variant that skips the first render and fires only on subsequent updates.

Implement a hook that returns the current window width and height, updating on resize.

Build a useState shared by every component that calls it, by subscribing React to a store that lives outside it.

Build a store whose subscribers each re-render only when the slice they selected changes.

Build a WordPress/Tapable-style hook system where plugins tap named actions and filters that run in priority order.

Implement a hook that threads state through an async action, folding the previous state into the next and exposing a pending flag.

Implement a hook that manages an array along with helpers to push, remove, update, and clear items.

Implement a hook that runs an async function and tracks its status, value, and error, with a manual execute trigger.

Implement an async hook that exposes a retry function to re-run the last operation on demand.

Implement a hook that warns before leaving a page while unsaved work exists.

Implement an optimized useBoolean hook whose returned setters keep stable identity across renders.

Implement a hook that returns the active responsive breakpoint name derived from the current window width.

Implement a hook that opens a named BroadcastChannel, delivers messages to the latest callback, posts data, and closes cleanly.

Implement a hook that fires a callback when a pointer event lands outside a referenced element.

Subscribe a component to one slice of a context so a change elsewhere in it does not re-render the whole tree.

Implement a hook that lets one component work both controlled and uncontrolled, deciding the mode from its props.

Implement a useState backed by a cookie — state the server can also write, with no event when it does.

Implement a hook that drives a countdown timer with start, pause, and reset controls.

Implement a hook that animates a number to a target over a fixed duration, independent of the display's framerate.

Implement a hook that tracks the system dark-color-scheme preference through matchMedia and updates when it changes.

Implement a hook that returns a debounced version of a value, updating only after a quiet period.

Implement a useEffect that re-runs when its dependencies change by value, not by reference.

Implement a hook that turns any element into a drop zone for files, text, and links, tracking drag-over state.

Implement a hook that manages a list whose items keep stable keys across inserts, removals, and reorders.

Implement a hook that tracks an element's size and position, staying correct across scroll, resize, and content changes.

Implement a hook returning a stable callback that always sees the latest props and state, avoiding stale closures.

Implement a hook that attaches and cleans up a browser event listener on a target element or window.

Implement a data-fetching hook exposing data, error, and loading, that refetches when the URL changes and ignores stale responses.

Implement a hook that traps keyboard focus inside a container while it is active and restores it on release.

Implement a hook that reports whether keyboard focus is anywhere inside a container, without flickering as focus moves between children.

Implement a hook that enters, exits, and tracks fullscreen mode for a referenced element through the Fullscreen API.

Implement a hook wrapping the Geolocation API to expose position, error, and loading state.

Implement a useState variant that also returns a getter for reading the newest state from inside stale closures.

Implement a hook that binds a shortcut like ctrl+k, matching modifiers exactly and ignoring typing in inputs.

Implement a hook that flags the user as idle after a period without keyboard, pointer, or scroll activity.

Implement a hook that tracks an image's loading, loaded, and error state, handling images already in cache.

Write a reducer whose body mutates a draft, getting an immutable next state that a reducer is required to return.

Implement a hook that manages a controlled input value alongside its dirty and touched flags.

Implement a hook that reports whether a ref'd element is intersecting the viewport via IntersectionObserver.

Implement a hook that runs a callback on a timer with a configurable, pauseable delay.

Implement a hook that returns whether a given key is currently being pressed on the keyboard.

Implement a hook managing an array with immutable helpers — push, removeAt, updateAt, insertAt, clear, and set.

Implement a hook that freezes page scrolling while a modal or drawer is open, coordinating nested locks.

Implement a hook that wraps an async function so it cannot run again while a previous call is still in flight, preventing double-submits.

Implement a hook that fires a callback after a pointer is held down past a delay, cancelling on early release or move.

Implement a hook that wraps a JavaScript Map with set, delete, and clear helpers backed by state.

Implement a hook that returns whether a media query currently matches and updates on changes.

Implement a useState-like hook that runs every incoming value through a mediator before committing it.

Implement a hook that turns a map of state transitions into bound, stable action methods over a reducer.

Implement a hook that reports online/offline status and connection info from the Network Information API.

Implement a hook that tracks notification permission and safely requests and displays browser notifications.

Implement a hook that shows an optimistic value while an update is in flight, then reconciles to the real value.

Implement a hook that reports the screen orientation type and angle and updates when the Screen Orientation API changes.

Implement a hook that reports whether the document is visible or hidden and updates on visibilitychange.

Implement a hook that manages page state over a total count, exposing page, pageCount, and next/prev/go with clamping.

Implement a hook that queries a browser permission, tracks changes, and handles unsupported or failed queries.

Implement a hook that reports the browser's primary preferred language and updates when the preference changes.

Implement a hook that tracks the system reduced-motion accessibility preference through matchMedia and updates when it changes.

Implement a hook that remembers the last value that actually differed from the current one, with a customizable comparator.

Implement a hook that tracks the loading, data, and error states of a promise-returning request.

Implement a hook wrapping a FIFO queue with add, remove, clear, and first/last/size accessors.

Implement a useState variant that defers commits to the next animation frame, so rapid updates coalesce to at most one render per frame.

Implement a hook whose state object you mutate directly, and reckon with what that costs React.

Implement a hook that gives a widget arrow-key navigation, keeping exactly one item in the tab order at a time.

Implement a hook that injects an external script tag and reports its loading status, deduping repeated sources.

Implement a hook that reports whether the user is scrolling up or down, ignoring jitter below a threshold.

Implement a hook that tracks the window scroll x/y position with a passive listener, throttled with rAF.

Implement a hook that tracks a multi-select over a list, with an all/none/partial header state that stays honest.

Implement a useState variant that records value history and exposes back, forward, and go over it.

Implement a hook that drives a multi-step flow with next, previous, reset, and bounded index controls.

Implement a hook that detects swipe gestures on an element, reporting direction once a drag passes a threshold.

Implement the useSyncExternalStore shim — subscribe to an external store and read a consistent snapshot, re-rendering when it changes without missing an update.

Implement a React hook that grows and shrinks a textarea to fit its content as the user types.

Implement a hook that reports the user's current text selection as live, plain state, updating as the selection changes.

Implement a hook that returns a throttled copy of a value, updating at most once per given interval.

Implement a hook that formats a timestamp as relative time like "3 minutes ago" and refreshes itself as time passes.

Implement a hook that runs a callback after a given delay and cleans up when the component unmounts.

Implement an effect that also tells you which of its dependencies changed since the last run.

Implement a useState that lives in the query string, staying shareable without burying the back button.

Implement a useState variant that reports whether the current value passes a validator, without an extra render.

Implement a hook that detects the Vibration API and exposes stable methods to start a pattern or cancel it.

Implement a hook that requests, releases, and tracks a screen wake lock, including browser-initiated release.

Implement a hook that detects Web Share support, validates share data when possible, and invokes the native share sheet.

Implement a debugging hook that logs which props changed between renders.

Implement a hook returning a debounced callback with cancel and flush, always calling the latest function.

Implement a pointer-based drag hook that tracks an element's x/y offset with start/move/end handlers.

Implement a form-state hook managing values, touched, errors, validation, and submission.

Implement a hook that loads more pages when a sentinel element scrolls into view, guarding against duplicate loads.

Implement a hook that reports a ref'd element's content-box size via ResizeObserver.

Implement a stale-while-revalidate data hook with an in-memory cache, dedup, and revalidation shared across components.

Implement a hook returning a throttled version of a callback that runs at most once per interval, with leading/trailing calls.

Implement an undo/redo state hook exposing undo, redo, canUndo, canRedo over past/present/future stacks.

Implement a windowing hook that renders only the visible rows of a long list, with correct spacer offsets.

Implement a WebSocket hook exposing connection status, last message, and send, with auto-reconnect and cleanup.