react

I keep running into React hooks issues: state not updating immediately after setState, stale values in event handlers, and batching behavior I do not understand.

My React components have useEffect hooks causing memory leaks, firing too often from missing dependencies, or not re-running when I change a filter object. I need to understand cleanup and dependency ...

I have API call state with loading, success, and error variants. Using optional fields allows impossible states. I want discriminated unions with full TypeScript narrowing.

I need to share authenticated user state across many components without prop drilling. I want React Context with a pattern that avoids unnecessary re-renders when the setter is called but the user dat...

I am building with Next.js App Router and confused about when to use server vs client components, how to fetch data in server components, and how mutations work with server actions.

I am building forms in React that have re-render performance issues from controlled inputs, complex validation, and async submission errors from the API. I want a clean performant solution.

My React app re-renders excessively. I want practical guidance on when useMemo and useCallback actually help vs when they are premature optimization that adds overhead without benefit.

My React app has a large JavaScript bundle. I want to split the code so users only download JS for the current page using React.lazy for component-level code splitting.

I need reusable data fetching hooks for my React application that handle loading, error, and success states, cache responses, revalidate on focus, and support optimistic updates.

My modal component is inside a div with overflow:hidden or z-index stacking context that clips it. I need to render the modal at the document.body level while keeping it controlled by my React compone...

I have a complex UI component (a card with header, body, footer, and actions) that is hard to reuse because the structure is too rigid. I want a flexible composition pattern that lets callers customiz...

Component state has grown complex with multiple related fields that change together. useState is getting unwieldy with many separate setters. Need predictable state transitions and easier debugging.

Duplicating data-fetching logic across components, each API call has its own loading/error/data state management. Need a generic, reusable data-fetching hook that works with any endpoint and return ty...

Using Next.js App Router. Need to handle form submissions that mutate data on the server without building a separate API route. Want type-safe server-side form handling with optimistic updates.

Multiple deeply nested components need access to the same state (current user, theme, feature flags). Prop drilling has become unmanageable. Want to avoid Redux for a smaller app but need predictable ...

Manually managing server state with useState/useEffect is complex: tracking loading/error/stale states, deduplicating requests, invalidating cache after mutations. Looking for a dedicated server state...

Bundle size is large because all components load upfront. Some pages are rarely visited. Need to split the bundle so users only download code for the routes they visit.

Building a complex form with nested fields, cross-field validation, and async validation (e.g., check if username is taken). Using controlled components with useState for each field is cumbersome and ...

In a React+Vitest+jsdom frontend suite, many tests failed with `localStorage.* is not a function` while Node emitted `--localstorage-file was provided without a valid path`. A robust fix was to define...

HeroUI React v3's Alert (from @heroui/react) takes a status prop, not color. Accepted values: default, accent, danger, success, warning. Content composes via Alert.Indicator, Alert.Content, Alert.Titl...

In a Tailwind v4 project, Biome's CSS parser treats directives like `@custom-variant pointer-fine (@media (pointer: fine))` and `@theme` as syntax errors with the message "Tailwind-specific syntax is ...

When migrating a React+TypeScript frontend from ESLint (js.recommended + tseslint.recommended + react-hooks.recommended) to Biome (linter.rules.recommended: true), expect a wave of a11y errors that th...