Blog
Mert Özen's blog posts on software development, backend, frontend, and DevOps.
useRef, Context and Custom Hooks: DOM Access, Context Instead of DI and the Rules of Hooks
useRef is a box that does not trigger renders (a DOM node or a timer id), while Context carries a value deep into the tree without props and re-renders every component that reads it when it changes. We move the Bookstore cart, theme and user into Context, measure a version where a theme change renders 28 components instead of 2, and show an inline ref callback stealing focus, a conditional hook crashing the app and the search split into custom hooks.
Using useEffect Correctly: Synchronization, Cleanup, Dependency Arrays and "You Might Not Need an Effect"
useEffect is not a lifecycle hook but a tool for synchronizing a component with an external system: every setup has a cleanup, and the dependency array lists the reactive values the effect reads. We connect the Bookstore catalog to API search and show with real network records that debounce and AbortController send one request even under StrictMode, that a late response overwrites the list without cleanup, and that useEffectEvent avoids a needless request.
Extending Copilot: MCP Servers, Custom Agents, Agent Skills and Hooks
In Copilot a rule that must hold belongs in a hook, not in an instruction: in Bookstore we told the agent outright to run dotnet ef database update, the model called the command and only a preToolUse hook stopped it. The Bookstore MCP server and .mcp.json, moving prompt files to skills, a skill and custom agent that check migrations, and real runs in Copilot CLI with a local model.