How to Auto Refresh Parts of Your Website with JavaScript

It's easy to auto refresh parts of your web page via an API, JSON or Database call - and I'll show you how to do it in today's video.
🏫 My Udemy Courses - www.udemy.com/user/domenic-co...
🎨 Download my VS Code theme - marketplace.visualstudio.com/...
💜 Join my Discord Server - / discord
🐦 Find me on Twitter - / dcodeyt
💸 Support me on Patreon - / dcode
📰 Follow me on DEV Community - dev.to/dcodeyt
📹 Join this channel to get access to perks - / @dcode-software
If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!
#dcode #javascript #webdevelopment

[@tattook7933]

thumbs up both hands !
"You've been helping us every single time."

[@JeanBotan]

Good solution! Thanks, Dom!

[@montebont]

Another nice one Dom. Thanks for sharing!
I've had to deal with this a lot in my projects so I'd like to suggest a slightly different approach.
I prefer to make the "ticker" or "heartbeat" a global custom event emitter that fires every second or so.
All relevant functions in my apps can subscribe to the ticker. I leave it up to the "subscriber" to decide if they need an update in "their" domain.
If so they pass a query and a handler function to deal with the response.
Bottom line it is about delegation of concerns too keep it nice and clean.
That being said...everything you covered in you video is very helpful to make your own variants.
Keep up the good works,
Ed

[@kerrykreiter445]

Thanks Dom! So much great content to digest. Your channel is helping me to level up.

[@dcode-software]

Awesome. I've been uploading a lot more recently so good to hear it's worth it!

[@seanplynch]

You write the cleanest code on YT

[@TomasMisura]

thanks a lot for this video, I learned something new again!

[@dcode-software]

Awesome. Thanks for watching again

[@FaribaGhorbani]

Thank you very much! great content.

[@dcode-software]

Glad you liked it

[@nic3point0]

I think also a more advance solution would be to use WebSocket and Web Worker API with Pub-Sub at the backend

[@dcode-software]

Yeah for sure - if you'd like real time data updates.

[@davidsyengo1893]

Nice!
Maybe use a proxy object for the employees data and trigger a UI update in the if the employees property gets set.
```
// To represent app state.
const data = {
users: [],
refresh: true,
intervalID: null,
timeout: 2000,
};
//proxy the data, renaming this variable to 'state' would make more sense
const dataProxy = new Proxy(data, {
set(target, prop, value) {
target[prop] = value;
if (prop === "users") {
updateUsersTable();
}
if (prop === "refresh") {
if (value === true) {
if (!dataProxy.intervalID) {
target.intervalID = setTimeout(dataRefresh, target.timeout);
}
} else {
clearTimeout(target.intervalID);
target.intervalID = null;
}
}
},
});
```

[@JNET_Reloaded]

It's dayta not darta

[@dcode-software]

🤷‍♂️