 Okay, so I'm Justin. I'm from General Assembly, like the other speakers before me. I'm a student, not instructor like Sebastian. So my talk won't be so impressive. My talk's more on callbacks and how it started off was, since I'm learning JavaScript, right, I'm trying to understand how callbacks work in other programming languages, but it's in JavaScript. And so this is my attempt at trying to make sense of callbacks. So if you already know callbacks, then you can verify. And if you don't, then sit back and relax and learn callbacks. So I start off with an analogy to explain callbacks. So we have a butler and the idea is that you want to tell the butler to make you a sandwich, right? And there are two ways you can do that. You can, the first way is, oh, sorry, the first way is the synchronous way. So you ask the butler to make you a sandwich and you wait there, watch the butler make the sandwich. Once it's done, it passes it to you and then you go off, right? So that's the synchronous way, that's the blocking way where you wait and you don't actually do anything, right? The other way is the asynchronous way. So you tell the butler to make a sandwich for you, but then you go off and do something else. When the butler is done, right, the butler will call you back, then you can just take your sandwich. So that's the asynchronous way, the non-blocking way, right? So these are just analogies to try and help you understand, or help me understand how callbacks actually work. The problem is that JavaScript is actually single-threaded, which means that it just reads one line at a time. You can only do one thing at a time. But it's able to somehow magically do this asynchronous thing. So I found it very difficult to understand how it's actually able to do this. I thought it was just magic, maybe it's or I don't know, it just did something to make it asynchronous. So it turns out with that analogy, right, what we have, the picture in our mind is that we have the app, right? So you've got your JavaScript here and then you've got your calls, like this is in every programming language, you've got this. And if you try to run your function, so here it'll read fn, it'll invoke the function, put that in the stack, right? And that function will call console.log. So console.log then goes into the stack and then console.log gets executed and then function gets executed and that's it. When you try to do set timeout and you put a function in there, that function behaves like a callback. And so this is what happens. The set timeout gets pushed into the call stack, right? And then it just goes off somehow and then the function comes back. Magically this is the magic part, this is the async part, which is strange, right? And then console.log comes in, goes off and off. So this is the strange part and if this is the model that we have in our heads for callbacks, it'll just be a question mark mystery. How did set timeout come in and then disappear and then how did the function call itself, right? So how did that happen? So now we're going to look at how async callbacks actually work in reality. So I watched this video and that sort of explained how callbacks really, really work, right? So that one was like, I think, like 40-odd minutes long, so I'm just going to summarize. So the missing parts in JavaScript is that the engine is not the only story, right? You've got other things in the browser and this also is the same sort of structure in Node. So if you're looking at Node, you won't have web APIs, but you would have like C++ APIs or something like that. Yeah, so now if we run this, now that we have the full picture and we try to run it, we see function works the same way, right? So this one's the same, no difference here. But now if we run setTimeout, setTimeout comes in and then remember how we said it disappeared. So it doesn't actually disappear. What happens is that the JavaScript engine doesn't actually run or doesn't know how to handle setTimeout. So it takes the setTimeout, it passes it to the web API which then runs a timer of how many seconds. In this case, it's just zero, right? And then once that timer is done, the function gets pushed to the callback queue, okay? And then the event loop will check if the call stack is empty. And if it's empty, then it'll just put whatever is on the queue onto the stack. So in this case, it's empty, so it'll just pop it into the stack. So that's how it's really working under the hood, right? So now when we think of... Oh, okay, let me just finish the animation, right? So there's this. So now when we think of callbacks, what's really happening is that it's not that it just magically appears like in the previous animation, what's really happening is that you can think of the setTimeout being passed to some other engine and that's running there, right? And then place the callback gets placed onto the queue and then from there we get placed onto the stack. So I think with this model, if you're very experienced with JavaScript, you probably already know this. I'm addressing more to people who are still new to it. Or if you have been around maybe your... If you had no idea that the web APIs were there and the queues were there and the event loop was there, now you know. Right. So that's it. Questions? No, I hope not. Do you implement the slides yourself in JavaScript? It's a keynote slide. Oh! I know. Thank you. Okay, that's all for today.