How to become a MERN Stack Developer? Step-by-Step

MERN — Mongo Express React Node

Want to become a MERN stack developer? But don’t know where to start. No worries! You are at the right place.

Here I’m going to tell you, how to become a MERN stack developer from a beginners point of view and also provide you with some valuable resources to learn, so that you can start building amazing websites on your own.

Becoming a MERN stack developer is not as difficult as you might think it is, yes it takes time to become one, but if you are disciplined and consistent enough, I’m sure you can nail it.

I’ve divided the learning process into 10 simple points so that you can understand every single detail in the easiest way possible.

So, let's get started.

  1. Desire is much more important than anything:

Stop reading this blog right now! If you have no desire to learn at all. I’m not kidding.

Learning MERN stack is a game of patience and having an attitude of not giving up, and desire plays an important role in maintaining this attitude.

Research as much as you can and check whether it’s suitable for you or not, don’t just look at the high income that people make with this skill. Go and get some hands-on it. Then you decide. Yes or No.

In the beginning, desire is all you need to get started.

2. Computer Science Fundamentals:

Knowing that you are committed to becoming a MERN stack developer, the first thing you need to do is know the basics of computer science.

This is very important. Lots of people get stuck while learning to code, this may or might be because of a lack of knowledge about computer science fundamentals or how computers actually work.

You just need to know the basics, that's it.

3. HTML and CSS:

After knowing computer science fundamentals, HTML and CSS are the first technologies you must learn.

HTML and CSS is the base of every website ever built.

HTML (HyperText Markup Language) acts as the structure of a website and CSS (Cascading Style Sheet) adds style to a website like colours, fonts, sizing, distance, position and many more.

Don’t get into learning CSS Frameworks before learning proper CSS. After you get a good hold over CSS, then you must try learning its framework so that you can learn it in less than a day or even just an hour. This can save you time.

MDN web doc and w3schools are some of the best resources out there to learn HTML and CSS. Give it a try.

Remember, practice and build while you’re learning. Try to create responsive web designs which can also match other devices width and height.

4. Learn Javascript:

For me, the best and the easiest language on the planet is Javascript. Seriously, it’s fun and engaging.

A person who says javascript is a boring language, doesn't know much about javascript.

After you finish learning HTML and CSS, you must start learning javascript. Javascript is a scripting language that is used to make websites dynamic and interactive. For example, clicking a button or creating a pop-up or even animations.

Again MDN web docs might be one of the best places to learn, but if you like to watch a video-based tutorial, freecodecamp’s javascript tutorial is the one for you.

While learning javascript, you’ll be introduced to topics such as DOM Manipulation, to learn those you can use this video playlist.

And as always, build while you’re learning. Practice creating responsive web designs and micro-projects.

5. Learn AJAX:

AJAX is also one of the important aspects of development. Once you become good enough at javascript, start learning AJAX.

AJAX (Asynchronous Javascript and XML) is used to create fast and dynamic web pages. With AJAX you can exchange data asynchronously without reloading the webpage.

To learn AJAX, watch this video by Traversy Media, probably one of the best videos out there.

6. Learn NodeJS, Express:

After you finish learning the above topics, you can now move on to the backend development.

NodeJS is not a language, it is a cross-platform, back-end JavaScript runtime environment that runs on the V8 engine and executes JavaScript code outside a web browser and Express is a NodeJS framework.

The above definition might sound very technical but you’ll know exactly what it does once you start learning it.

With NodeJS you can build real-time applications such as

  • Chat App
  • Video Streaming Platform
  • E-Commerce websites

Learn and know how it works? what are npm modules? what are the routes? MVC (Model View Controller)and many more.

For learning NodeJS, I would recommend you to watch NodeJS Tutorial for Beginners by TheNetNinja. It might be a bit lengthy tutorial but I’m sure it would be worthwhile.

7. Learn MongoDB:

MongoDB is a database to store and retrieve data.

MongoDB is a NoSQL database with no complex joins, schema-less, easy to scale and deep-querying features.

It works smoothly with javascript as it uses the JSON (Javascript Object Notation) format to send and receive data. Learning a NoSQL database such as MongoDB in 2021 might be one of the best things you could do.

Try to understand how it works? how is it different from other DB? what is schema? how to connect MongoDB through mongoose with NodeJS? and many more.

To learn MongoDB, I would recommend you to watch this video playlist by TheNetNinja.

8. Learn Authentication and Authorization:

Who doesn't want authentication and authorization on their websites?

Authentication helps to identify whether you are the right person or not and Authorization means what can you do and not do based on your user type (user, admin, manager).

These securities are mostly used in login systems and user/admin systems.

PassportJS is a node module that can help you set-up an authentication and password reset system on your application.

Make sure to learn this too. I recommend you to watch this video by Traversy Media to learn authentication with PassportJS.

9. Learn ReactJS (JS Framework):

A lot of people might not agree with me as I’m telling you to learn ReactJS at the very end.

But for me, this is the best sequence to learn the MERN stack because I think, to become better at the front-end you also need to become good at the back-end.

I’ve seen people learning ReactJS after Javascript and getting stuck just because ReactJS brings its all new components onto the desk at once and it becomes quite difficult to consume all that knowledge.

So, I think it’s better to learn ReactJS after you know how the back-end works. Later, it becomes less difficult to learn and understand ReactJS.

And now, last but not the least.

10. Never Stop Learning:

It’s not a motivation quote or something, I’m literally telling you to “Never Stop Learning”.

This is because the software industry always introduces its latest technologies and making better improvements (especially the front-end) in every few years. So you always need to keep yourself up to date with the latest markets trends.

So, having an attitude of always learning new things can help you become better all the time.

Hope this might be useful for you. If I’ve missed any points, you’re welcomed to add those in the comment section.

Thank You 😊

--

--

--

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

React useState Hook

Enforce that all keys in a map are a key of a certain type (Typescript)

ECMAScript 6 Important Features(let,const and arrow function)

The painless way to collect statistics from a web-site

4 More React Native Libraries You Might Have Missed

A Deeper Dive Into React Hooks

Fish hook

The Complete Guide to ES10 Features

Deploy Website with Netlify and With Your Domain Name

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Vishrut Margam

Vishrut Margam

More from Medium

Creating a Link-Sharing Site Part 0

How to start your Javascript learning journey

4 essentials developers types you need to code your website.

How can you create an app? (with no previous coding knowledge)

A mechanical keyboard