How to Upload Image From React Native App to Node JS

In this video we will see how we can upload image from our #ReactNative App to #NodeJS backend server.

Now if you guys don't know then this is the video series where we are creating a full stack app using node js, mongo db, expree and cloudinary at the backend and React Native at the front end.

In the previous video we saw that how we can read image from our device usig expo-image-picker. You can check out the video.

Also you can check out the link below to see the entire playlist.

Buy me a coffee

[mohmedishak]

Broooo thank you sooo much, this helped me to complete a feature for my final year project. You're truly a full stack guy.

[versan]

You're amazing! I've been looking for a way to do this but it never worked. I just needed to watch 25 seconds of your video and I got it to work! Hope you will continue doing your thing. These 25 seconds were a life savor! 7:25 7:50 . I've subscribed!

[richardoffiong]

Man thank you so much, I really hard a tough time uploading images with react native..thanks again for the tutorial

[marcosschmidt]

t is not working in react native, it keeps showing an error, but by postman it works correctly

[Zero-qcnu]

I have question while uploading image and file using document picker using form data i got a network error sometimes and sometimes I am not getting this error in Android itz working fine in ios

[CMRCET-JASHWANTH-P]

im gettign this error

" Error while uploading profile image Cannot read properties of undefined (reading 'path') "

i dont know whether it from cloudinary or multer

its giving both file and path are undefined

const result = await cloudinary.v2.uploader.upload(req.file.path, {
public_id: `${user._id}_profile`,
width: 500,
height: 500,
crop: 'fill',
});

[anonymouspanda]

If I want to publish this app onto the app store, what website host (preferably free) would work for the backend? Heroku doesn't seem to have file storage. I just want it to be temporary, such as an upload, I run a function with the image in the backend, and then return output and the image can go away.

[codecombination]

I think so i understand the whole process and as we can see in video it is working for you too but i get this error
Multipart: Boundary not found

it not shows when i put semicolon after form/data but then image is not received in backend

[psuarezdev]

when i do that it returns an error

Network request failed

But just when I try to upload an image from expo react native, cuz when I do it from postman there is no problem

[kornelijussliubauskas]

Doesnt work in react-native :( fighting with this for an couple of hours, postman is sending it correctly but axios from react-native doesn't.. cant uderstand why

[rajeshkhadka]

Brother... How we can pick a multiple imgs ??

[NewleadersTech]

What abt sending image from node js to sql
. How would u do it? In unicode form?
What do u suggest

[failist]

Bro, I don't want to increase your work but can you make a video on how to setup android emulator like you have in this video whenever you get time.

[priyankaghumre]

Sir I am following this series from first video and now at this point I am getting one error after uploading image in my backend that multipart: boundary was not found, so can you suggest some solution because I have checked all possibilities and still stucked with this

[rasalahmad]

Working from postman but not from react native

[osmanforhad]

bro please make some video with ReactNative MongoDb and Node Express

[jithinraj]

If I want to send a string (image name) along with image . Is it possible

[shailpatel]

Do you create paid projects ? if yes, please make one for me . i will pay the amount chargeable