I would like to express my gratitude for your invaluable tutorial, which has greatly aided me, particularly in understanding and implementing middlewares. Despite my recent transition to backend development, I have spent an entire month diligently working on this seemingly straightforward project without success.
Explained everything very well in detail, learned so much in under 2 hours. Best video I have watched on MERN, also a great re watch for a refresher on MERN.
Thanks for this video, it was overall excellent. I especially loved that you rolled with the mistakes/typos and take us through the process of how you identify the issue and correct it.
wow, this tutorial video is an absolute gem! The clarity of instruction, the depth of knowledge shared, and the engaging presentation truly set it apart. Thank you for making complex concepts so accessible and for empowering learners like me to enhance our skills.
As a beginner in react, it is was really helpful to me. I appreciate your efforts and make this kind of videos in future best of luck buddy for upcoming projects and happy coding 😊
If you're facing an issue where cookies aren't showing up in the header, try removing the 'return res.json(user)' line from the last part of the 'try' block within the 'loginUser' function.
i want to say how grateful i am when i found this tutorial making login, register page with mern. you taught us step by step. i have no other words to say. i am speechless. Thank you so much and SUBSCRIBED :)
Hi everyone! I think I fixed the need to refresh the page to render the elements based on the user. In the Login component page add the following code: Import the context file: import { UserContext } from "../context/UserContext" Deconstruct the setUser from the context: const { setUser } = useContext(UserContext); Then, right below the axios.post to login and above the setData({}), set the user to data.user: setUser(data.user); Took me a couple of days of trial/error and it might not be the best fix, but I hope it helps! If anyone has additional comments, please comment it and lets improve together Apart from this small issue, great tutorial! Thanks to the creator :D
Great video. Followed it all the way through and with some rewatches I got it all to work. I think you would get a lot of views with some quicker "follow up" videos. Adding a log-out button, making multiple user role types, and editing data within the dashboard would be logical next steps. There also seems to be a lot of people asking for source code, I think that is because most of the other MERN stack guides are older and don't work anymore. Maybe you could sell the source code, get a buy me a coffee link or something. Great start!!
Thank you for the fantastic tutorial! I appreciate the clarity in your explanation and the attention you put into the video. Keep up the great work! I hope your channel continues to grow even more!
@@brettwestwooddeveloper I just have one question, I just finish your tutorial and works fine, but When I change user, I need to refresh to render the Hello `new user`.. How can I make this dynamic, in case I back to login page and when I log in, I dont need to refresh the page to display the "updated" data?
8:10 , if you want to import a component automatically, you should just keep this component open in your VS code tabs bar. You managed to import automatically only login and register components because they were open
De los mejores videos que he visto para aprender a realizar un MERN completo felicitaciones!!! por mejorar un poco la pantalla grande del lado izquiero para ver y observar mejor las validaciones que realizas con las Developer tools , Continua asi exitos y bendiciones
Good class. Very helpful. Only thing I wish there was a github repo of the class so I could check my work with yours when I do a mistake. Thanks for the lesson though!
Brett, I have to say that everything is amazing to follow and very easy to understand, I am wondering for a bit more info about the port connection from the beginning, and how I can connect it with my actual page, it would be awesome to have some more ideas or videos about it bro. happy to learn from you amazing job!
Sir in this video the login and registration form is created. Sir please make a video on how to show that data in the profile and why to put the image as well. Please sir
Again, why do you need to refresh the page to show the greeting message "Hi Brett!"? couldn't you have just shown that greeting the moment the user logs in?
Wow this was really good video. I really liked it. A little bit explanation how logout works is missing other than that its a real good tutorial. simple and easy for beginners like me.
Ok now I need some help guys. I want to add other things to the Dashboard as well! I want to add a sidebar and nav bar, two divs and all. Problem is, I don't know where to add it. If I add anything else, it stops working
Great tutorial! Thanks for making it!!! I was just wondering if you could continue with this project adding Google Authentification 2.0. Or if you know any other good tutorial or resources where they show you how to add Google Auth to the already existing context and jwt
Hi Tyler and thanks for the support and watching my content. I don't know a good video about Google Authentication with MERN stack. However, I do have a Google Authentication video using Next Auth. Which is with Next.js. ua-cam.com/video/I_YCC_nFt70/v-deo.html
Thank you thank you so much brother you are like God gifted for me.🫡🫡🙏🙏 I am bca student from India and I am very helpful for my project, but not anyone can teach for best way but I see your video. I thought, why can't find first you..❤
Awesome but some . were , and some , were dots drove me crazy but it helped me understand the code much better thank you check the Auth file if anthing went wrong if you are trying to compare hashedpassword with password
Thanks a lot brett for this amazing tutorial, really loved it, although I am getting an error that I am not receiving the data of user on the dashboard, could you please help me somehow?
Please help me am stuck i was even add imgFile so when I click login I receive an error message from imgFile I will send the code here in the comments section
Just one thing, If you are creating an account why you should login again to get a jwt token. if someone is creating an account why not send it at that time
I mistakenly deleted all the file by using git I'm unable to undo it , can you please provide link if you have saved it in any repo please. I'm using it in my project. It took me whole day to watch your video and do it piece by piece
Hey there, thanks for the tutorial mate, im having my end of studies project and am following your video to create a video, the single difference is that in the final dashboard file i'll be integrating a power BI dashboard and i was wondering how is that doable ?
@@brettwestwooddeveloper thanks for replying, no no, since am studying in the "Data analysis " field, i made a powerBI report, and i successfully integrated it in the mock Dashboard page we made in the tutorial ( thnx again for the vid you're a life saver) now I just need to customize the home page and make it beautiful ( Am still a bit lost on how to do that) and eventually add a logout feature
Yes, you can use any database you want. But the MERN stack specifically uses MongoDB and if you don't use MongoDB then its not technically a MERN stack anymore. I have never used MySQL but I have heard its not as scalable compared to Postgres SQL or MongoDB. Still a good option for personal or small projects.
@@brettwestwooddeveloper Thank you very much for the response and information, greatly appreciated ☺️. This may be a silly question but what would it be called instead of MERN? Yes I want to start off with my first small project but the recommendation is to use MySQL. I will definitely look into learning and using MongoDB in the future.
the token is not setting in the cookie and when signin it doesn't define the payload and response form the server, can anyone have the source code of this so I can see what wrong with my code
Great video, I have some questions, when I type the password in React, if I Login and inspect the login Network Payload, I can see the password before it is hashed, how can I fix that?
I would like to express my gratitude for your invaluable tutorial, which has greatly aided me, particularly in understanding and implementing middlewares. Despite my recent transition to backend development, I have spent an entire month diligently working on this seemingly straightforward project without success.
No problem! Glad I can help you and appreciate the support!
Explained everything very well in detail, learned so much in under 2 hours. Best video I have watched on MERN, also a great re watch for a refresher on MERN.
Thank you!
Thanks for this video, it was overall excellent. I especially loved that you rolled with the mistakes/typos and take us through the process of how you identify the issue and correct it.
wow, this tutorial video is an absolute gem! The clarity of instruction, the depth of knowledge shared, and the engaging presentation truly set it apart. Thank you for making complex concepts so accessible and for empowering learners like me to enhance our skills.
Thank you so much! Glad you are enjoying my content!
This was amazing, thank you. I haven't seen a video to explain exactly step by step, with checks along the way. Backend makes alot more sense now
this has to be the best video that has broken down all the concept of user interaction with a server
As a beginner in react, it is was really helpful to me. I appreciate your efforts and make this kind of videos in future best of luck buddy for upcoming projects and happy coding 😊
No problem, glad you enjoyed it!
If you're facing an issue where cookies aren't showing up in the header, try removing the 'return res.json(user)' line from the last part of the 'try' block within the 'loginUser' function.
Thank you bro
That isn't in the loginUser, it's in the registerUser function. Taking it out of the registerUser function also had no effect.
@@dalarcoin6851 you are talking about another part and problem, if you watch carefully you can see the problem that I mentioned
you look like a model than a software engineer
I am halfway through the video and the video is very easy to follow along
Thanks a lot for the tutorial
Thanks for the kind words! Glad I could help you!
i want to say how grateful i am when i found this tutorial making login, register page with mern. you taught us step by step. i have no other words to say. i am speechless. Thank you so much and SUBSCRIBED :)
Hi everyone! I think I fixed the need to refresh the page to render the elements based on the user.
In the Login component page add the following code:
Import the context file: import { UserContext } from "../context/UserContext"
Deconstruct the setUser from the context: const { setUser } = useContext(UserContext);
Then, right below the axios.post to login and above the setData({}), set the user to data.user: setUser(data.user);
Took me a couple of days of trial/error and it might not be the best fix, but I hope it helps! If anyone has additional comments, please comment it and lets improve together
Apart from this small issue, great tutorial! Thanks to the creator :D
thats really awesome man, thanks for helping, I had the same issue and this fixed it, its better if you just paste the whole code here though.
Trust me bro u have great potential on this platform , you will definetly reach millions of subscribers
Thank you! Hopefully that happens!
@@brettwestwooddeveloper and yes there is a little thing you can improve is : your screen is so zoom out , things are not seen clearly
Your guidance was incredibly helpful, and I really appreciate the time and effort you put into this.
No problem! Glad I could help you out!
Great video. Followed it all the way through and with some rewatches I got it all to work. I think you would get a lot of views with some quicker "follow up" videos. Adding a log-out button, making multiple user role types, and editing data within the dashboard would be logical next steps. There also seems to be a lot of people asking for source code, I think that is because most of the other MERN stack guides are older and don't work anymore. Maybe you could sell the source code, get a buy me a coffee link or something. Great start!!
i have production grade code. do u wanna buy me a cafe. it costs 1000USD.
Bro, you don't know how you saved my life. stay blessed
No problem! Glad I could!
Hats off to you for teaching these important items so complete. Please do more related MERN stuff in the future.
Thank will do!
Brett, You are a blessing mate!, Explaining everything in exact details, Words won't describe how thankful we are for you!!
Keep it Up!!
Bro you are good instructor everything you explained in very smoothly
Thank you very much!
@@brettwestwooddeveloperplease help me , I'm getting network error in axios
Thank you for the fantastic tutorial! I appreciate the clarity in your explanation and the attention you put into the video. Keep up the great work! I hope your channel continues to grow even more!
Thank you so much Lucas!
@@brettwestwooddeveloper I just have one question, I just finish your tutorial and works fine, but When I change user, I need to refresh to render the Hello `new user`.. How can I make this dynamic, in case I back to login page and when I log in, I dont need to refresh the page to display the "updated" data?
@lucassilverio8923 are u adding d status code while logging in??
8:10 , if you want to import a component automatically, you should just keep this component open in your VS code tabs bar. You managed to import automatically only login and register components because they were open
This is the best video on the topic! Thank you so much! Also, could you please make a video for the logout part as well?
Just Completed This Tutorial and feedback is that Well explained, Any begineer can also understand this complex procuedure. Thank you very much
Saved my life! The only tutorial that i just got a click on my head.. thank u!! I subscribed to your page 😉 u deserved it 100000000
Pulled it off! Now I can use this anywhere!
Thank you for the clarity! This tutorial saved my life! 😋
Thanks a bunch, brother. Such a fantastic tutorial for beginners.
Hats off to you!!! Thank you✌✌
Thank you! and no problem!
It was great learning and coding together . please provide the css part also !!
Thank you but unfortunately I don't have the source code for this anymore.
honestly, this is the only tutorial that works. plus tnx for details
Hi Glad that I found your tut, hoping to have more regarding MERN CRUD, thanks
I will in the bear future, just been busy with Next.js
This actually helped me a lot thanks!
Glad I could help you out there!
You deserve more subscribers ✅💯
You explained it in very understanding way, point to point 😍🤩
Subscribed 👍❤
Thank you!
De los mejores videos que he visto para aprender a realizar un MERN completo felicitaciones!!! por mejorar un poco la pantalla grande del lado izquiero para ver y observar mejor las validaciones que realizas con las Developer tools , Continua asi exitos y bendiciones
Good class. Very helpful. Only thing I wish there was a github repo of the class so I could check my work with yours when I do a mistake. Thanks for the lesson though!
Brett, I have to say that everything is amazing to follow and very easy to understand, I am wondering for a bit more info about the port connection from the beginning, and how I can connect it with my actual page, it would be awesome to have some more ideas or videos about it bro. happy to learn from you amazing job!
Great, I liked your step by step approach
Thank you!
only half way through the video but i love the react toast its so clean
Thank you so much for this tutorial!
It gives such an awesome basis for projects and loads of understanding about Node and Express!
Great video, still working through it. Any chance you could share the finished code?
Thanks so much for the tutorial, this was really really helpful. Clear and concise explanations! I have subbed and look forward to more videos.
Thank you for the support and glad I can help!
Top notch content!
Thank you!
broo its the best video on this topic!!!!!!!!
Subscribed🤩🤩
Thank you so much for the sub! Means a lot!
Thank you for your tutorials ❣
You are so welcome!
A github repo could be cherry on the top.
Anyway Great content.
Thank you and yea I wish I had one for this. I am going to recreate this video anyways!
Thanks for the video man! I have learnt a lot from it.
Awesome! Glad you were able to. Appreciate the feedback!
That was very cool, easy to follow the tutorial, super useful information, thank you very much!
Thank you so much, glad I can help!
awesome tutorial I watched the whole thing. Exactly what I was looking for Thank you
Sir in this video the login and registration form is created. Sir please make a video on how to show that data in the profile and why to put the image as well.
Please sir
Thank you sir it was great
Again, why do you need to refresh the page to show the greeting message "Hi Brett!"? couldn't you have just shown that greeting the moment the user logs in?
did you find any solution for this? I have been struggling with this problem for days
Wow this was really good video. I really liked it. A little bit explanation how logout works is missing other than that its a real good tutorial. simple and easy for beginners like me.
Thank you so much this helped a lot.
Glad it helped!
Ok now I need some help guys. I want to add other things to the Dashboard as well! I want to add a sidebar and nav bar, two divs and all. Problem is, I don't know where to add it. If I add anything else, it stops working
This is a very good tutorial, thank you sir. i subbeddd
Amazing job!!!! It was an amazing build
Thank you!
Such a great tutorial man!!....
its helped a lot bro thanks...
😍
No problem you are welcome!
hyy , i am getting error of intermediate object undefined while making register page try and catch section
thanks for the tutorial! After the login how can i avoid having to refresh the page in order to see the data?
First off thanks for the sub! And yes I will have to make another video demonstrating this because you shouldn't have to refresh the page manually.
Please also create admin login and dashboard which shows all users data who logged in with there name and the email only
Will do! Great suggestion!
Great tutorial! Thanks for making it!!! I was just wondering if you could continue with this project adding Google Authentification 2.0. Or if you know any other good tutorial or resources where they show you how to add Google Auth to the already existing context and jwt
Hi Tyler and thanks for the support and watching my content. I don't know a good video about Google Authentication with MERN stack. However, I do have a Google Authentication video using Next Auth. Which is with Next.js. ua-cam.com/video/I_YCC_nFt70/v-deo.html
is anyone having a problem with Axios? the git and post request keeps throwing errors for me in register, login and userContext
Thank you thank you so much brother you are like God gifted for me.🫡🫡🙏🙏 I am bca student from India and I am very helpful for my project, but not anyone can teach for best way but I see your video. I thought, why can't find first you..❤
Awesome but some . were , and some , were dots drove me crazy but it helped me understand the code much better thank you
check the Auth file if anthing went wrong if you are trying to compare hashedpassword with password
hope you would have added a logout as well,
Really helpful tutorial. One remark, you could've also added a logout part to this tutorial. Really helpful tho
1:33:32 in this place i get an error "jsx attributes must be only assigned a non-empty 'expression'."
Thank you very much, very well explained.
thanks for the video man!!
Thanks a lot brett for this amazing tutorial, really loved it, although I am getting an error that I am not receiving the data of user on the dashboard, could you please help me somehow?
Please help me am stuck i was even add imgFile so when I click login I receive an error message from imgFile I will send the code here in the comments section
Subscribed ✅
Thank you!
thank you for this tutorial!,very helpful!
Glad it was helpful! Thanks for the sub!
Tienes un nuevo seguidor! Increíble el video! : )
1:39:15 ill be saving this timestamp for future. i hope i can fully understand this soon. :)
Glad you are enjoying it
subscribed! amazing vid
super useful, thank you very much.
You are welcome! Thanks for tuning in!
great explanation
Hi! thanks for the video. I have a problem, i cannot see the cooki on the request headers. Can you help me?
I also cannot see
Great tutorial ! Can this be built upon whereby there is an admin side to see which users have signed up?
Thanks Brother !!
Just one thing, If you are creating an account why you should login again to get a jwt token. if someone is creating an account why not send it at that time
Thanks a lot
🎉
How to make /login not available if the user already logged in.
why we need to reload page to show username in dashboard
what we can do to directly show username without refreshing it
I mistakenly deleted all the file by using git I'm unable to undo it , can you please provide link if you have saved it in any repo please.
I'm using it in my project.
It took me whole day to watch your video and do it piece by piece
also when you login the userContext doesnt change so that needs to be fixed
I will have to recreate this video in the near future
Кайф, спасибо мужик)
Sorry don't understand
@@brettwestwooddeveloper It's Russian: Cool, thanks man)
Is there any way to implement the dashboard that it loads user data without refreshing manually? 🙂
Where's the souce code for this???
this a best project for beginners and i love the way Brett Sir teaches us LOVE FROM INDIA
I have been stuck on it for a day now... 1:28:10 i have the same problem but it doesnt resolve on refreshing
In App.js set "axios.defaults.withCredentials = true"
Did you ever find the fix for this?
could u share the project code ? this tiny thing will save us hours as it is easy to follow☺☺
why did u need vite ? could u have done the same w npx create-react-app stuff
Hey there, thanks for the tutorial mate, im having my end of studies project and am following your video to create a video, the single difference is that in the final dashboard file i'll be integrating a power BI dashboard and i was wondering how is that doable ?
Thanks for the sub! When talking about the dashboard are you talking about the UI or getting the user information to display on the screen?
@@brettwestwooddeveloper thanks for replying, no no, since am studying in the "Data analysis " field, i made a powerBI report, and i successfully integrated it in the mock Dashboard page we made in the tutorial ( thnx again for the vid you're a life saver) now I just need to customize the home page and make it beautiful ( Am still a bit lost on how to do that) and eventually add a logout feature
Thank you for the tutorial, very well made. Can I use MySQL instead of mongo? What are the trade-offs and the difficulty level please
Yes, you can use any database you want. But the MERN stack specifically uses MongoDB and if you don't use MongoDB then its not technically a MERN stack anymore. I have never used MySQL but I have heard its not as scalable compared to Postgres SQL or MongoDB. Still a good option for personal or small projects.
@@brettwestwooddeveloper Thank you very much for the response and information, greatly appreciated ☺️. This may be a silly question but what would it be called instead of MERN? Yes I want to start off with my first small project but the recommendation is to use MySQL. I will definitely look into learning and using MongoDB in the future.
Thanks for the video and I don't know if it is a stupid question but which mouse are you using? I just really like the click sound.
What you did at 1:28:20 so that the request header starts showing cookies
In App.js set "axios.defaults.withCredentials = true"
the token is not setting in the cookie and when signin it doesn't define the payload and response form the server, can anyone have the source code of this so I can see what wrong with my code
Heyy same problem.
do you mean in request header? if so the in App.js set "axios.defaults.withCredentials = true"
Great video, I have some questions, when I type the password in React, if I Login and inspect the login Network Payload, I can see the password before it is hashed, how can I fix that?