Software Engineer: C++ C# Java, Python, JavaScript

Web Dev: HTML, CSS, JavaScript, NodeJS

Game Dev: Unity, Unreal, Java

App Dev: Flutter, Objective C, Java, Swift, Kotlin, React

Cyber Security: Python, Linux, Networking

AI & Data Science - Julia, Haskell

🔰 Autoplay Video on Scroll using JavaScript!!

Check if the video is fully in view, and if so, play it; otherwise, pause.
The muted attribute is added to ensure autoplay on most browsers.

Beginner's Guide to Mern Stack
👇👇
https://datasimplifier.com/mern-stack-tutorial-2/

The useEffect clean-up callback executes on every render

Most people think it executes only when the component unmounts, but that’s not true.

On every render, the clean-up callback from the previous render executes just before the next effect execution.

Let’s see an example:

function SomeComponent() {
  const [count, setCount] = useState(0)

  useEffect(() => {
    console.log('The current count is ', count)
    return () => {
      console.log('The previous count is ', count)
    }
  })

  return <button onClick={() => setCount(count + 1)}>Click me</button>
}

This logs the following:

// Component mounts
The current count is 0

// Click
The previous count is 0
The current count is 1

// Click
The previous count is 1
The current count is 2

// Component unmounts
The previous count is 2

🚀 Why This Matters?

This behavior is essential for managing subscriptions, event listeners, and cleanup logic effectively.

Adding a dependency array ensures the effect runs only when needed