Learn the MERN Stack - Full Tutorial (MongoDB, Express, React, Node.js)

Tutorial developed by Beau Carnes.

--

[TraversyMedia]

I like the title. I have seen that somewhere before...lol

[SREERAJM]

Backend(Express): 12:02
Frontent (React): 43:32
Connecting Frontend to backend : 1:19:40

[nicklandreth]

I am now in love with the MERN stack. Thank's for the introduction Beau!

[DubiousPhoenix]

This tutorial actually just saved my grade. Needed a way to post text from state to my db and fetch all entries and you saved my life thank god for you

[ureka]

Really awesome tutorial. We've just gotten to the point in our bootcamp where we're tying together all the skills we've learned so far (i.e. the MERN stack), and this video explained how to connect everything in quickly and concisely. Thanks, Beau!

[Christian-mrvh]

This is the most short, complete, clear and beautiful MERN crash tutorial, thanks a lot.
Hopefully to keep watching tutorials like this one.

[chrissnoek]

Been looking for a beginner tutorial that was more recent, perfect timing!!

[tridhe]

This tutorial walks through the whole freaking process. Great tutorial. Thank you so much for this. I'm broke else I would've joined your channel as a sponsor.

[imangm]

Great Tutorial! Something I would like to say is that on 01:39:00 you said the difference between Class Components and Functional Components in React is that functional components don't support state and lifecycle methods which is not true anymore. You may use useState, useEffect and ... in functional components and they are even the preferred method these days. Thank you

[DmwsrIFearGod]

I have taken an online class and watched more then a few videos. You explain what everything is doing and I understand way more now. Thank you.

[qingqingyang]

Thank you Beau, this is the first project that I completely followed through. I really like the selected information you gave, they are very on point. And thanks the comment section for very helpful information too.

[Vikram]

You guys are simply awesome, thanks a zillion for this tutorial. God bless you

[princebassey]

Great content. I've done in-depth learning from an online platform. I like how this is summarized with good explanations. Like others have indicated, a more in-depth tutorial for intermediate and advanced programmers would help

[Arkrez-vptt]

7/11/2022 Here are the issues and the fixes I ran into while following along, none of them were very severe and all but the last one was solved quickly.

Error at 17:50 line 14 I was getting errors when I included the flags in mongoose.connect(), just pass the uri as the only argument.

Error at 1:15:23 if nothing is appearing in the console, then that is probably because the page was refreshed when the form was submitted. All you need to do is go into the top right of the inspect panel, there should be two gears click on the lower gear for setting and select "preserve log", this will stop the console from refreshing.

The final error I got is at 1:45:13 and says "params is not defined", for whatever reason you can't reference params like that anymore and idk how to get around it without making the component a function. The alternative solution is to grab the url in the search bar and snag the id that way. In edit-exercise.component.js go to componentDidMount() at the top paste "const arr = This creates an array consisting of every step in the url path of our current page. Then in the axios.get() call replace this.props.match.params.id with "arr[arr.length-1]". This gets the last element of our array which happens to be the id of the exercise that we are editing. The ID is what we need to make correct calls to MongoDB. Do the same thing for the onSubmit function in the same file.

(The final solution is not saleable, the more branching paths there are in the url, the harder it will be to maintain. If anyone knows a better solution, please let me know because honestly this one feels pretty hacky)

Hope this helps someone!

[israellomba]

Man you're awesome. I am not native in english, yet I understood everything you said! I wish all teachers could be as patient when talking as you. Great course.

[henryherrera]

Thanks Beau! Recommended video, although classes in React are not used anymore, at least not in general. But for a beginner, it is a very useful tutorial. I hope to see an updated MERN course using hooks soon! Best of luck! God bless! :)

[DJEricSeed]

Hi Beau. I'm a totally beginner to MERN stack (coming from LAMP one)
I have a MERN project to dive in and, fortunately, it seems that previous developers build it the way you described in your video.
Then I feel so much more confident after only two hours seeing your video that I wanted to thank you sincerely!
I didn't knew about this channel but now I'm hooked. Thanks!

[dhwanikpanchal]

I have learned so much from this channel that when I get a job I will definitely sponsor you guys. Love the amazing work you guys are doing.

[abuahmed]

I took the complete lessons and i new nothing before starting this lecture on MERN. What a fantastic teacher sir you are. Lots of prayers for you. Regards

[samstring]

Very helpful tutorial for MERN stack.

One issue I faced while doing it was that 'It wouldn't connect from my personal IP to MongoDB Atlas'. I was able to fix that issue by changing the network access setting in MongoDB to allow IP address from anywhere. If you are facing same problem fix it that way.

PS: If you are having problem with him pasting code, you shouldn't be here. I believe this tutorial is for those who have the basic understanding of ReactJS, nodejs and express. Coding everyline would make it extremely long and hence uninteresting. You can learn the basics from other channels and come here.