DEV Community

Cover image for RoadMap to learn MERN Stack for Beginners

RoadMap to learn MERN Stack for Beginners

Kishan Sheth on March 14, 2021

MERN Stack consists of four technologies. M - MongoDB E - Express R - React N - Node All these technologies are built on JavaScript. To lear...
Collapse
 
shaijut profile image
Shaiju T • Edited

I think we can learn all these for FREE instead of udemy.

Collapse
 
miguelmoramax profile image
miguelmoramax

off course, fullstackopen.com/ look that

Collapse
 
Sloan, the sloth mascot
Comment deleted
 
firatt profile image
• Edited

at first I also straggled to switch English but there actually is English version at: fullstackopen.com/en 👍

Collapse
 
samnayakawadi profile image
Samir Nayakawadi

Thanks. Its completely free & Awesome. Made My Day.

Collapse
 
lifenavigator profile image
LifeNavigator

It depends on the individual I guess. I personally paid for courses because it fit with my learning methods, and there was support available on the content creator's discord. It's also nicer that downloaded materials and exercised are given.

Collapse
 
erescobar profile image
erescobar

Node.js is not a backend language.

Collapse
 
kishansheth profile image
Kishan Sheth

Thanks for pointing it out. My bad, Node can be used as backend development environment.

Collapse
 
musiliusamad profile image
Musiliu Samad

It's a JavaScript runtime environment...

Collapse
 
lexiebkm profile image
Alexander B.K.

Yeah... it is a Javascript runtime platform that can be used for any tasks that needs automation using Javascript language, including for creating a HTTP/Web server.
Due to its low-level, however, frameworks are created so that they can help web developers to quickly develop backend application like Express, Koa, Fastify, NestJs, etc.

Collapse
 
debojyotibabai profile image
Debojyoti Ghosh

Hello my name is Debojyoti, I want to say that I already learnt React js. Now I want to learn node. But I dont understand how and why to use node, because we can call api and use routes in react. All node js tutorial teaching us how to use node with html css...there we need node for api calling and routing, but in react why we need node? and how to use it. thanks in advance

Collapse
 
kishansheth profile image
Kishan Sheth

React is for Frontend and Node is for Backend. Consider you're working on a website with database access then you'll build you're Frontend with react and for backend you'll be using Node. Now you'll start React on default port 3000 and start node on something like 3001 port. Now Make a api which return some response and call it from react. We just use Node for the backend purpose.

Collapse
 
lexiebkm profile image
Alexander B.K.

Now, one thing I am thinking is how to do the same approach Laravel has for web development. From Laravel official site/documentation, it is clear we can use Laravel for two different purposes :

  1. A full-stack, stand-alone development, in which React or Vue.js in the frontend is integrated part of the full-stack application. The React/Vue front-end then is considered 1st party app, instead of 3rd party. For this purpose, we write code for routing in the file named web.
  2. A backend app that provides APIs for 3rd party apps written with any supported tools, including React or Vue. For this purpose, we write code for routing in the file named api.

As for MERN stack, from what I have seen the 2nd approach mentioned previously is the most used one. I am trying to find the 1st approach like Laravel provides for this MERN (and also MEAN) stack : a full-stack, standalone application.
We can also agree the "M" in the stack can be MySQL instead of MongoDB, depending on what database we want to use.

Collapse
 
metruzanca profile image
Samuele Zanca

No need to pay for udemy courses. YouTube has plenty of great content creators with free courses.

Collapse
 
democera profile image
DemoCera

Great 🙌🙌

Collapse
 
kishansheth profile image
Kishan Sheth

Thank You.

Collapse
 
thisurathenuka profile image
Thisura Thenuka

Codevolution by far has the clearest explainations ❤

Collapse
 
kishansheth profile image
Kishan Sheth

That's why it has been included in the list :-)