🔸 TLDR ✅

▪️ useWindowSize returns the current [width, height] and updates on every browser resize.

▪️ Perfect for responsive UI logic when CSS alone isn’t enough. 📱➡️🖥️

🔸 THE HOOK SNIPPET 🧩

🔸 WHY IT’S USEFUL 🎯

▪️ Toggle layouts (drawer vs sidebar)

▪️ Conditionally render components based on width

▪️ Resize charts/grids dynamically 📊

▪️ Build adaptive UX without spreading listeners everywhere

🔸 GOTCHAS TO KNOW ⚠️

▪️ SSR (Next.js): window doesn’t exist on the server → guard it.

▪️ Performance: resize fires a lot → throttle/debounce if you do heavy work.

🔸 TAKEAWAYS 🧠

▪️ Centralize resize logic in one reusable hook ✅

▪️ Always cleanup event listeners (you did it right) 🧼

▪️ For production: add SSR safety + optional throttle

What’s your #1 use case for useWindowSize? 👇

#React #JavaScript #Frontend #Hooks #ResponsiveDesign #WebDevelopment #UI #SoftwareEngineering #CleanCode

🏆 Thrive at React job interviews: https://www.udemy.com/course/react-reactjs-questions-and-answers-2023-job-interviews/?referralCode=C52F8C70EFA5555C18AC