Accessing Images from Firebase Storage in React Native 

Thank you sooooooooooo much, others were making it harder by using fileReader, this is 10x easier thank you! PS, i use react but i am learning react-native which is why i needed this!

Thank you so much! I have been searching for this a long time.... Thank you Once again!

Thanks! This really helps a lot!!!

Thank you much needed ❤️

i love your energy omg

U deserve the world ❤

bro i love you THANK YOU

Thank helpfull video😍

thank you soooooooooooooooooooooooooooooooooooooooooooooooo much you helped me a lot i was really stuck

thanks for your help!! you explain stuff very well!

Thanks

thanks

Please teach us everything about firebase react native expo please!😘

Hello Please put a video on how to edit metadata on firebase storage in react native

I have tried the same pattern but i donot get the url

Please do you how to display data from firestore to a pie chart

I need to render in my app the image that is in the firestore, the url is already there, I want to send an image from my gallery, I want it to go to the firestore, and store the url there, and with this url render in my application, HELP ME

hey could you help me out with this , const uploadPost = async () => { setRequestRunning(true); const response = await fetch(uri); const bloob = await getBlobFromUri(uri); const storageRef = ref(storage, `hbdas/${user.user.uid}/${uuid()}}`); const uploadTask = uploadBytes(storageRef, bloob); await getDownloadURL(uploadTask).then((x) => { setUrl(x); console.log(x); }); it just gets stuck and doesn't print the x

but how could i get multiple images ??? just HOwwwwWWWWW PlzzzzzzzzzzzZZZZ

Great and simple video BUT I have a question and a doubt. I am using ImagePicker from Expo like one of your previous videos, and if(!result.cancelled), I am setting an image on a useState hook variable like setImage(result.uri) which is fine, and my uploadImage() is uploading images with the blob and I can see the images being uploaded by a specific uid(probably my current logged in user) in my firebase storage. BUT now, when I try to retrieve it back like yours with useEffect, it's not showing me any image in my Image source. Code is pretty much the same BUT do you think, your *setUrl* hook variable is mine *setImage* in this case. Because in the source is {{ uri: image }} ? I have attached my code below. const [image, setImage] = useState("upload.wikipedia/commons/7/7c/Profile_avatar_placeholder_large.png"); const pickImage = async () => { // No permissions request is necessary for launching the image library let result = await ImagePicker.launchImageLibraryAsync({ mediaTypes: ImagePicker.MediaTypeOptions.All, allowsEditing: true, aspect: [4, 3], quality: 1, }); if (!result.cancelled) { setImage(result.uri || url); uploadImage(); } }; const uploadImage = async () => { const blob = await new Promise((resolve, reject) => { const xhr = new XMLHttpRequest(); xhr.onload = function() { resolve(xhr.response); } xhr.onerror = function(e) { reject(new TypeError("Network request failed")); }; xhr.responseType = "blob"; xhr.open("GET", image, true); xhr.send(null); }); const ref = firebase .storage() .ref() .child(`${auth.currentUser.uid}/profile_pic.jpg`); const snapshot = await ref.put(blob); const remoteUri = await snapshot.ref.getDownloadURL() // when we're done sending it, close and release the blob blob.close(); // return the result, eg. remote URI to the image return remoteUri; } useEffect(() => { const func = async () => { const storage = getStorage(); const reference = ref(storage, `${auth.currentUser.uid}/profile_pic.jpg`); await getDownloadURL(reference).then(url => { setImage(url); }) if(url == undefined) { func(); } } },[]); {image && }