When we call that time out, we get back and identify her for the timer we are creating, so I'm going
to take that identifier and assign it to a variable that I will call timer.
Now, we need to make sure that we somehow clear this timer.
We need to make sure we cancel it if a user ever updates input again.
So for this, we can use a built in feature of the use effect function.
Remember, something you could do instead of use effect is return a function.
If you return a function, then it will be called automatically the next time use effect is called.
So we can make sure that inside there we execute our logic to cancel the previous timer that we had
set up.
So inside the cleanup function, we'll put in a clear time out of timer like so.
So let's save this, go back over and do a quick test.
Now, I should be able to start typing out maybe a console log right here and I can type as much as
I want, and it's only after I stop typing for one second that that is actually executed.
You can see about one second after I stopped typing inside that string, I saw the console log.
I'll try changing it to say a number type type type, type, type, delete, delete, delete, whatever
I want to do.
And then after I stop for one second, then we see the execution.
All right, so it looks like this is working perfectly now, one thing I want to mention is that if
you want to, you can definitely adjust this time right here from one second.
If you want to execute a user's code more frequently, you can take it down to maybe five hundred milliseconds.
And now that just means that if a user starts typing.
And then pauses for half a second.
We're going to immediately execute their code, so you might decide that you want to execute users code
very frequently.
But if you do, just remember that if you start to allow a user to just pause for half a second while,
maybe some invalid syntax is inside the editor, well, you're going to try to execute that and the
users plug and end up seeing a nasty error message.
So you might want to allow a greater delay.
But again, it's totally up to you or me.
I think that five hundred milliseconds is totally reasonable.
Maybe I'll split the difference and go to seven fifty.
But again, it's really up to your personal preference.
OK, so this looks good now it looks like everything is working as expected, but we're going to see
if we start testing out some advanced features of our code editor that maybe we broke something along
the way.
So let's take a quick pause right here.
We're going to kind of do a quick spiel or a quick rundown of our code editor, make sure everything
is still working as expected.
And yeah, there might be something we need to go back and fix up.
So let's take a pause right here and continue in just a moment.