Science & Technology

#25 Project using Spring Add Product with Image

📚 Main topics

Adding product imagesThe tutorial extends the Spring product application to accept and store an image alongside each product, then outlines the image URLs the frontend will use to retrieve images. 0:31
Updating the product modelThe product model gains image name, content type, and byte-array data fields; the image data is stored in the database as a large object. 6:16
Handling multipart requestsThe controller accepts the product and uploaded image as separate request parts, then passes them to the service layer. 9:24
Saving the image with the productThe service reads the file’s original name, content type, and bytes, adds them to the product, and saves it to the database. 12:30

✨ Key takeaways

Separate product and image dataThe frontend sends product details and the image separately, so the backend uses multipart request handling rather than accepting only a JSON request body. 4:12
Choose an image storage approachImages can be stored in cloud storage with a URL in the database, or stored directly in the database; this tutorial uses the latter for simplicity. 6:47
Check the database resultThe uploaded image’s data, name, and type appear in the product table, confirming that the image is being saved. 15:07

🧠 Lessons learned

The image display needs another endpointAlthough the image is stored successfully, the frontend requests it through a separate product image URL, which the backend has not yet implemented. 16:40
Some product fields need debuggingThe demo also reveals missing or incorrect product details, which the instructor attributes to a possible mismatch in the UI data or field names. 15:38

🏁 Conclusion/next steps

Continue in the next videoThis installment focuses on accepting and saving a product image; the next step is to build the image-retrieval endpoint so images can display in the product list and detail view. 17:11

telusko navin reddy tutorial Java Blockchain

Transcript excerpt

0:00 now it's time to move to the next step now this step is bit crucial not exactly crucial but then uh difficult to understand uh because when I was doing this before the video uh there are lot of moving parts and there a lot of uh things we have to take care of because we are not just doing adding of the new product because that's what we have discussed right uh so we have talked about getting all the products and we are getting those products on the page so just to show you the browser this is what we had so if I see here we got the products and if you click on this uh you

0:31 will also get the items that is working right uh but now what I want to do is I want to basically have images as well so with each product I want to get their image because that will make it more interesting right so because when you go to any website or any e-commerce website with the product you also get the image and of course when you click on this thing on the left hand side also I want an image next thing I want is the add product of course this is not there so we have to change the UI as well but I want is this option of adding a product

🔒 The full, searchable transcript is available with Pro.

Suggestions