The tutorial demonstrates configuring the Serve Static module in NestJS to expose local images via an API. It then implements an asynchronous function in the product service to verify image file existence using the file system API, ensuring the UI correctly handles missing product images.
Length 9:08
Captions English (Generated), Spanish (Auto-translated), French (Auto-translated), Korean (Auto-translated), Portuguese (Auto-translated), Vietnamese (Auto-translated) #nestjs #backend #programming #static-assets #typescript #api #file-system #web-development #coding-tutorial #software-engineering
0:00 All right, so now that we can upload product images to our 0:04 server and save these images on our local file system, we 0:08 need a way to actually expose these images 0:11 publicly so that any caller can hit our API and 0:15 actually get access to any of these static resources that's 0:19 inside of this public folder. 0:21 To do this, we're gonna utilize the serve static 0:25 package that we installed in an earlier lecture. 0:28 So make sure you have the NestJS Serve static library installed, and 0:32 now let's go ahead and, and configure it. 0:34 So I'll open up my app.module. So now in here, I want 0:39 to directly go ahead and import the Serve 0:43 Static module from 0:45 Nestjs/serve-static. Now we're gonna call 0:49 for root on this module to initialize it and then give it 0:53 the options object where we need to specify the root 0:56 path property. And so this is going to be where in our 1:00 backend server we're actually going to expose the content inside 1:04 of it to the public through an API. 1:08 So in our case, we know that's already going to be in the 1:11 public folder 1:12 where we're hosting our product images. 1:15 So let's provide that path using join from path, 1:19 and then we'll go ahead and provide the current directory name, 1:23 and then simply go up a single directory and go into 1:27 the public folder. So this is the actual folder that we want to 1:31 expose 1:33 as static assets. So now with this single change in 1:37 place, we should be able to navigate to our 1:39 backend server, 1:41 localhost three thousand and one, and actually go into the products 1:44 folder, which matches our file system public 1:48 directory, 1:49 and access the static assets inside of it. 1:51 So that's exactly what I've gone ahead and done here. 1:54 We can see I've navigated to the product of
The rest of the transcript is for members.
Sign in