Rules of Hooks

Functions whose names start with use are Hooks, and two rules govern where they may be called. First, only call Hooks at the top level of a React function, before any early returns: never inside loops, conditions, nested functions, event handlers, class components, try/catch/finally blocks, or functions passed to useMemo, useReducer, or useEffect. Second, only call Hooks from React functions — function components and custom Hooks — never from regular JavaScript functions. Custom Hooks may call other Hooks because they themselves are supposed to run only while a function component is rendering. Following these rules keeps all stateful logic in a component clearly visible from its source code. The eslint-plugin-react-hooks plugin catches violations automatically; making that lint rule a hard build error rather than a warning is Koskamo editorial guidance. Scope: React function components and Hooks. Reviewed October 4, 2026.