In this lecture, you'll learn how to build an event-driven architecture that seamlessly connects a NestJS backend with a Next.js UI using EventEmitter and Server-Sent Events (SSE).
By the end of this lecture, you'll have a fully functional event-driven system, where NestJS emits and processes events, and Next.js dynamically reacts to them in real-time. Perfect for applications requiring live notifications, background processing, and reactive UI updates. 🚀
Length 45:08
Captions English (Generated), Spanish (Auto-translated), French (Auto-translated), Korean (Auto-translated), Portuguese (Auto-translated), Vietnamese (Auto-translated) #nestjs #nextjs #turborepo #asynchronous #event-driven #architecture #server-sent-events #coding-tutorial #web-development #software-engineering
0:00 Hey everyone. In today's lecture, I'm gonna show you how our applications 0:03 can 0:04 stay decoupled and highly scalable using asynchronous 0:07 workflows. Now, this is gonna work by using an event-driven 0:11 model 0:11 where we actually emit events using the event emitter library on 0:15 NestJS backend. And when we receive those events, 0:18 we can process a 0:19 certain job, and we also create a server sent 0:23 event connection from the backend to a Next.js UI here. 0:27 So in this case, you can see my Next.js UI has been loaded. 0:30 Now on my Postman here, I can go ahead and trigger a new request to 0:34 create an account. Now, when this account gets created, 0:37 it's going to 0:38 generate some new snapshots in the background using an 0:42 event-driven approach, and that's gonna happen asynchronously. 0:45 So if I go ahead and launch a request to get my snapshots now, it's an empty array. 0:49 However, if I now create this account and fetch the 0:53 snapshots, you can see that they are populated. 0:56 And again, this is happening through an event-driven 0:58 model asynchronously. 1:00 The accounts service actually doesn't call the snapshots service directly. 1:04 Instead, it's merely emitting an event, and the snapshot service will pick that 1:08 event up and process it. Additionally, we can see on the Next.js 1:12 UI, we received this snapshots generated 1:14 event, and this is thanks 1:16 to a server sent event connection we have established to 1:20 our NestJS backend. Additionally, this is user-specific, so 1:24 only events that we trigger with a given user ID will actually be 1:28 consumed by that given user here on the client side. 1:31 So I'm so excited to go through this architecture with you today 1:34 and see how we can 1:35 get up and running with an asynchronous event-driven model. 1:38 Let's go ahead and get started next. 1:40 All right, so to go ahead and get started, let's go ahead and use
The rest of the transcript is for members.
Sign in 