React useRef: Access DOM Without Re-rendering!🔍📌

Ever wanted to access a DOM element or store a value without causing a re-render? That’s where useRef comes in!

🔹 What is useRef?
It’s a React Hook that lets you:
Directly access DOM elements
Store mutable values that don’t trigger re-renders

🔹 DOM Example:
const inputRef = useRef();
<input ref={inputRef} />
<button onClick={() => inputRef.current.focus()}>Focus</button>

🔹 Non-DOM Example:
const inputRef = useRef();
<input ref={inputRef} />
<button onClick={() => inputRef.current.focus()}>Focus</button>

🔹 Why It’s Useful:
Avoids unnecessary renders

Perfect for focus management, timers, or tracking previous values

🔥 Final Thought: useRef is like a tiny memory box inside your component—super handy and lightweight!