React useRef Hook

useRef accesses DOM elements and stores values without re-render.

Accessing DOM Elements

```javascript import { useRef } from 'react';

function Input() { const inputRef = useRef();

const focusInput = () => { inputRef.current.focus(); };

return ( <div> <input ref={inputRef} /> <button onClick={focusInput}>Focus</button> </div> ); } ```

Storing Values

```javascript function Timer() { const countRef = useRef(0);

const increment = () => { countRef.current += 1; console.log(countRef.current); // Doesn't trigger re-render };

return <button onClick={increment}>Increment</button>; } ```

Remember

- Use for DOM access - Values persist across renders - Changing ref doesn't trigger re-render

> Next: Learn React performance optimization!