Thank you so much for this, really helped me out. For any readers in the comments you can restrict the input element to only allow images by adding the *accept="image/*"* tag for all images, or if you only want jpg/jpegs you can use *accept="image/jpeg"*
Mate, thank you very much. I've seeking for the solution for 3 hours and haven't found. You're great, I am totally thankful for this video. Ones again Thank you. I was thinking, I won't find, but than I found you, and my developer's life resurrected again!
Thank you my teacher!!! for the custom hook, before I use it and make login and logout button disappear I used redux so I can change its className to hidden lol but this was just some lines of code... it blew my mind!
Hey Logicism. I love this series of React/Firebase tutorials! I am beginner and your videos helped me a lot! Thanks and if you can make one video about user roles that would be great!
hi Ropepe thank you so much for this comment, i'm glad the video helped! And about the user roles, that is very high up on my todo list in my video ideas.. implementing firebase auth with react-router and storage
I was getting a 403 permission error when uploading. On the firebase page in the Rules tab, I changed it to rules_version = '2'; service firebase.storage { match /b/{bucket}/o { match /{allPaths=**} { allow read: if true; allow write: if request.auth!=null; } } } and it worked. Though I read this might not be a good idea in production
Thanks for the video. I do have a question though. If you were to logout after creating a user and profile pucture. Then Log back in would the profile picture you previously stored render?
I have a problem when I navigate through different pages, the profileImageSrc state gets set to the default picture for a little bit till the actual one gets loaded, it's feeling weird how can I fix it
After watching your video, I became a solid learner of firebase. However, this error occurs when uploading the file. storage/unauthorized Firebase Storage: User does not have permission to access I wrote the code exactly like you. Can you give me an answer?
hi! thx you very much for your lesson! but i have a question: i have lots of users and each of them has a photo. how can i display their pictures in users list?
You'd store their pictures in Firebase Storage, then store the url in each user's profile in Firestore, then use .map() to make a users list in your React App. Hope this helps!
Everything worked for me till i got to the part where the profile picture displays on the app. i keep getting this error "userInternal.getIdToken is not a function".
hm, let me say that when u refresh page there is moment that currentUser is undefined (u see login page), then server respond (u see photo page) - how to avoid that?
@@lenart2552 unfortunately, this is just the way that Firebase is built. if you really want a way around this, you can implement a global loading state within react to show a loading screen while firebase auth is initialising
Hi, thanks a lot for this video! I m building a react listing marketplace web app, users can upload their data and cover image with a form, before i watched your video i had a problem because i can only upload cover pics with my file uploader in the form. I wanted to have a coverphoto on the listing page aswell a profile photo, you gave me the solution by uploading the profile photo on the signup form, now i want to render this photoURL on the listingpage, i keep getting errors, do you have any suggestion how to do this? Thnx for the great video!
This helped me even after 2 years of uploading. Great work, you guys are real heros
Bro you are a pro. Love u. Thanks for this great video. Now I have successfully add user profile functionality in my website by following your video.
Thank you so much for save my time. I have been searching this for complete an assignment.
I haven’t watched the vid I just saw it got put up but I know it’s going to be great ! Ur the man keep on going
haha Daniel thank you so much for your kind words :))
Thank you so much for this, really helped me out. For any readers in the comments you can restrict the input element to only allow images by adding the *accept="image/*"* tag for all images, or if you only want jpg/jpegs you can use *accept="image/jpeg"*
Mate, thank you very much. I've seeking for the solution for 3 hours and haven't found. You're great, I am totally thankful for this video. Ones again Thank you. I was thinking, I won't find, but than I found you, and my developer's life resurrected again!
very very helpful. thank you dear. keep the good work
Thank you my teacher!!!
for the custom hook, before I use it and make login and logout button disappear I used redux so I can change its className to hidden lol but this was just some lines of code... it blew my mind!
You're amazing
that question mark (Optional chaining) is amazing 😃
yes it totally is xD
Totally underrated video
This is helpful. great video.
Thanks so much for teaching me (us) Firebase 9!!!!! Appreciate a lot!!
Thank you a lot man, you helped a lot with my project using the authentication and storage in firebase.
Hey Logicism. I love this series of React/Firebase tutorials! I am beginner and your videos helped me a lot! Thanks and if you can make one video about user roles that would be great!
hi Ropepe thank you so much for this comment, i'm glad the video helped! And about the user roles, that is very high up on my todo list in my video ideas.. implementing firebase auth with react-router and storage
@@ravenjs Then we will wait :D Thanks once again for great job ;)
please continue as soon as possible I will continue with you
thank u so much Cylia haha
Great tutorial. Easy to follow. I got my avatar pictures working now
Very helpful. Thank you
I was getting a 403 permission error when uploading. On the firebase page in the Rules tab, I changed it to
rules_version = '2';
service firebase.storage {
match /b/{bucket}/o {
match /{allPaths=**} {
allow read: if true;
allow write: if request.auth!=null;
}
}
}
and it worked. Though I read this might not be a good idea in production
Thanks this helped me too!
Thank you so much!
Nice and informative
Thanks for the video. I do have a question though. If you were to logout after creating a user and profile pucture. Then Log back in would the profile picture you previously stored render?
Thanks buddy it helped a lot
amazing video thank you!
THANK YOU!
Hey Logicism! I love your series.Can you please make video on a subCollection in firebase
glad you love the series! do you mean subcollections in Cloud Firestore? If so, yes im cooking up a video on that :))
Great tutorial 😍
you are the best
you the best too hehe :))
This is super helpful, thank you! 😄
Sir can I ask a question ? How can I do populate a ref in document like in mongodb but in firestore?
I have a problem when I navigate through different pages, the profileImageSrc state gets set to the default picture for a little bit till the actual one gets loaded, it's feeling weird how can I fix it
After watching your video, I became a solid learner of firebase. However, this error occurs when uploading the file.
storage/unauthorized Firebase Storage: User does not have permission to access
I wrote the code exactly like you.
Can you give me an answer?
perhaps it's your auth or firebase security settings? there is a section in the firebase console for "Auth rules"
I want you to teach me how to upload Image and text into storage and firestore and display on another page.
how can we then add the file path URL from the storage into firebase database?
How can we implement this using firestore?Please help
For storing other details too
Like name and age
hi!
thx you very much for your lesson!
but i have a question:
i have lots of users and each of them has a photo.
how can i display their pictures in users list?
You'd store their pictures in Firebase Storage, then store the url in each user's profile in Firestore, then use .map() to make a users list in your React App. Hope this helps!
If possible for the next vid can you show how you will create multiple user profiles ?!
by multiple user profiles do you mean multiple users?
@@ravenjs yeah multiple users. Each user is able to post thier own unique content
@@danielodiase6824 unique content? yea basically we just have to link auth to firestore.. which i plan ondoing in the next vid :))
next add edit ,delete functionality with add user detail.. thanks
Everything worked for me till i got to the part where the profile picture displays on the app.
i keep getting this error "userInternal.getIdToken is not a function".
just checkin, did you manage to fix this?
@@ravenjs thanks for checking in , yeah it was due to where I placed my code , but I got it sorted out and my code worked great !!!
hey Logicism, great work with this series; what about passing currentUser to another page from "/" to "/photo"?
hm, let me say that when u refresh page there is moment that currentUser is undefined (u see login page), then server respond (u see photo page) - how to avoid that?
@@lenart2552 unfortunately, this is just the way that Firebase is built.
if you really want a way around this, you can implement a global loading state within react to show a loading screen while firebase auth is initialising
thank you sir
How to have the page refresh itself?
Hi, thanks a lot for this video! I m building a react listing marketplace web app, users can upload their data and cover image with a form, before i watched your video i had a problem because i can only upload cover pics with my file uploader in the form. I wanted to have a coverphoto on the listing page aswell a profile photo, you gave me the solution by uploading the profile photo on the signup form, now i want to render this photoURL on the listingpage, i keep getting errors, do you have any suggestion how to do this?
Thnx for the great video!
I keep getting the error, snapshot is assigned a value but never read - from .firebase does anyone know how to fix this?
Why I get Error FirebaseError: Firebase: Error (auth/network-request-failed)?
have you tried any other browsers e.g. Firefox, Chrome, Edge ? Do you get the same errors?
@@ravenjs I'm using chrome, and I've also seen the error appear in your video using firefox
@@newbieCieL in the video? could you comment the timestamp
@@ravenjs 20:20 in console
@@newbieCieL oh that haha for me it was just a temporary error that goes away after i refresh the page. is it crashing your app totally?
lllllesss goooo