(#1 Frontend) Profile Image Upload to Amazon S3 in React, NodeJS, MongoDB

Опубликовано: 05 Июнь 2025
на канале: Frontend Interview Pro

8,183

136

In this video I will show you how you can make a Profile Image Upload feature using React, NodeJS, MongoDB and Amazon S3. As you can see this is my current profile picture and here I have a little camera icon. When I click on this icon I get 3 options View, Change and Remove, so remove will basically remove my profile picture and change will allow me to upload a new profile picture.

------------------------------------------------------------------------------

Timestamps -
0:00 Intro
1:56 Adding Clear and Upload button
2:50 Implementing the Clear feature
3:35 Restructuring our code
6:13 Making the Avatar component
7:46 Adding the Menu component
14:26 Integrating Cropper component with Avatar component
17:30 Implementing the close Cropper feature
22:30 Adding the Snackbar / Toaster
32:51 Adding the Spinner / Backdrop
36:30 Conclusion

------------------------------------------------------------------------------

Starter Files - https://github.com/manishboro/image-c...
Crop, Zoom and Download images in React -    • Crop, Zoom and Download images in React us...

------------------------------------------------------------------------------

Follow me -
Instagram :   / manish_boro
LinkedIn :   / manish-boro-692b16198

------------------------------------------------------------------------------

My PC Specifications -
Graphic Card : GALAX RTX 2060 https://amzn.to/3hmSsCZ
RAM : HyperX Fury 8GB 3200MHz * 2 https://amzn.to/3k3Pc17
Processor : Ryzen 5 3600 https://amzn.to/2FkQzd0
CPU Cooler : CoolerMaster H410R https://amzn.to/3hql7rb
Motherboard : MSI B450 Tomahawk Max https://amzn.to/2Fq10f6

** All the above mentioned links are affiliate links **

#upload_images_in_react #reactjs #nodejs #mongodb