Hello I created a system to control multiple heaters and locations, I used Node, React, Javscript, Python3, C and Linux. I have a question though. What is the best way to update information on the page. This is what I came up with. This is on the react front end.

    const update = () => {
        setTimeout(async () => {
            await fetch(`${backend}/mainobject`, {
                method: 'GET',
                mode: 'cors',
                headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json',
                }
            }).then((responce) => {
                return responce.json();
            }).then((responce) => {
                for (let i = 0; i < responce[2].length; i++) {
                    if (parseInt(responce[2][i].id) === parseInt(unit.controlRoomId)) {
                        if (document.getElementById(index) !== null) {
                            document.getElementById(index).innerText = "Current Temp: " + responce[2][i].currentTemp;
                        }
                    }
                }
            }).catch((error) => {
                console.log(error);
            });
            update();
        }, 60000);
    }
    update();

I get the feeling this is not the best way to do it. I did the entire project on video this is the video I added the update function. https://youtu.be/pgPWgvoMt5g I use useState to store all information the app needs in an object but if I tru to auto fetch it then it causes an problems using useState it keep fetching and rerendering. Ideas?