How to change dynamically the web title in React

To change the web title dynamically in React, we need to update the document.title variable using the useEffect Hook.

For example, let's suppose that we want to implement a counter that changes document.title every second:

jsx
import React, { useEffect, useState } from 'react';

const Timer = () => {
    
    const [counter, setCounter] = useState(0);

    useEffect( () => {
        
        setTimeout( () => {

            document.title = counter;
            setCounter(counter + 1);

        }, 1000);  
            
        
    }, [counter]);
    
    return null;
    
}

export default Timer;

Hi, I'm Erik, an engineer from Barcelona. If you like the post or have any comments, say hi.