5 Things AI Can't Do, Even in React

This report addresses in depth the limitations AI-assisted tools encounter in React development process. In five main topics specific to React including component semantics and composition, state management and data flows, async and concurrent behavior, accessibility and ARIA integration, and build and toolchain, why AI makes errors and tasks it cannot do are examined. Technical detail is provided for each topic and frequent mistakes AI code assistants make, failure modes, are shown with examples. For instance in React, DOM semantics matter. Li elements must definitely be inside ul or ol and unnecessary div usage should be avoided. AI codes sometimes wrap list items incorrectly leading to accessibility errors. In state management, stale closures with useState and useEffect hooks are important React traps. A useEffect used with empty dependency array cannot see state changes creating incorrect behavior like always writing counter value as 0. AI can easily overlook such subtle points. Si