DEV Community

loading...
Cover image for Technologies That I'll Be Learning in 2021 as a MERN Stack Developer (with resources)

Technologies That I'll Be Learning in 2021 as a MERN Stack Developer (with resources)

itsnitinr profile image Nitin Ranganath Originally published at thesmartcoder.dev Updated on ・5 min read

Hi Dev Community!

2020 has been a year of learning for me and I'm positive that this has been the case for tons of other self taught developers out there. From React to Redux, 2020 has shaped me into becoming a full stack developer, something that I'm passionate about.

Going forward, I have decided to learn the following technologies in 2021. While this is not a 'top 10' list for things that you SHOULD learn, this is just my take on it. Having said that, please feel free to share your opinions or suggest new technologies. I've also left some links to free resources for learning all the technologies I talk about. Alright, enough talk. Let's dive into the main stuff.


TypeScript

TypeScript Banner

One thing that I was grateful for in 2020 was that I was able to build big projects, to a level that it was becoming kind of tedious to keep up with the bugs and potential issues that were popping up. Enter TypeScript! I've heard lots of people praising TypeScript for exactly solving this problem. Since it's also used in lots of production level projects, I see no reason to avoid TypeScript.

Resources to get started:
TypeScript Tutorial by Academind on YouTube
TypeScript Playlist by The Net Ninja on YouTube


React-Query

React Query Banner

I'm excited for this one. So what exactly is react-query, you ask? It is a NPM package which you can use to asynchronously fetch data from an API. That's the simplest explanation that I could come up with. But hey, doesn't Redux with Axios do the same? Yes, but react-query comes with features such as auto-caching, garbage collection, infinite scroll and much more! Definitely something which you can use to improve your developer experience as well as performance. By the way, if you use Redux, you might want to checkout Redux Toolkit.

Resources to get started:
React Query Playlist by The Net Ninja on YouTube
Redux Toolkit by Justim Kim on YouTube


Tailwind CSS

Tailwind CSS Banner

I've used Bootstrap, Materialialize CSS and Bulma in the past. But somehow, Tailwind CSS still manages to excite me. I've heard great things about it and have also seen some stunning websites built using it. I'm aware of how it is a bit different from other CSS frameworks out there but that's where the fun lies. For the React side of things, I also want to explore Material UI a bit more.

Resources to get started:
Tailwind CSS Crash Course by Brad Traversy on YouTube
Tailwind CSS 2.0 Crash Course by codedamn on YouTube
Tailwind CSS Playlist by The Net Ninja on YouTube


NextJS

NextJS Banner

Next is great! I tried it for a brief period of time around the end of 2020 and I see no reason why I shouldn't take it up and use it in my own projects. If you're a React developer, the learning curve is pretty smooth. The benefits it brings, such as server side rendering and automatic image optimization make it well worth learning. Highly recommend it for all the React devs out there.

Resources to get started:
Next.js Fundamentals by Mehul Mohan on codedamn
Next.js Playlist by Bruno Antunes on YouTube


GraphQL

GraphQL Banner

GraphQL is a query language for fetching data from APIs. What makes it great is that it is capable of exactly what is requested for and getting multiple resources in a single request, thus saving us multiple requests to the API server and improving the performance. I've only been using REST APIs till now and excited to see how GraphQL can improve my future projects.

Resources to get started:
Learn GraphQL by Web Dev Simplified on YouTube
GraphQL Playlist by The Net Ninja on YouTube


PostgreSQL

PostgreSQL Banner

PostgreSQL or basically SQL databases are something that I've been wanting to give a try for quite some time now. I have used MongoDB my database needs in all my previous projects. I appreciate the freedom of NoSQL databases but SQL databases are widely used as well and can be a better option in some cases. Getting good at SQL and SQL databases is going to be one of my priorities this year.

Resources to get started:
PostgreSQL Tutorial by FreeCodeCamp on YouTube


Jest

Jest Banner

Jest is a JavaScript testing framework which can be used to test your Node, React, Angular, Vue, TypeScript and other JavaScript code. I'm no fan of testing currently but it is such as essential skills which can differentiate two programmers especially when it comes to large projects. I have not delved deep into knowing more about Jest but from my limited research, it aims to do what I want.

Resouces to get started:
Jest Crash Course by Brad Traversy on YouTube
Jest Introduction by Web Dev Simplified on YouTube


Advanced JavaScript

JS Banner

Wait, what? JavaScript? Well, yes but no. Advanced JavaScript concepts such as V8 Engine, closures, hoisting, event loop, threads, binding and much more. The MERN stack is fully JavaScript and so it makes sense to get a good grasp over JavaScript, right? People do tend to miss out on the above mentioned topics when they're first learning JS and rightly so. However, it's good to go back to plain JavaScript once in a while to learn these topics.

Resources to get started:
Advanced JavaScript Concepts by Andrei Neagoie on Udemy (Paid)


React Native

RN Banner

Websites are great, no doubt! But the ease of use that applications provide make it a valuable skill to learn. I personally felt that I could get more users on my projects if only I had a mobile application on top of the website. React Native seems to be a good choice since I already know React and can hugely benefit me through code reuse. There's also Flutter, which uses Dart if you like that more.

Resources to get started:
React Native Crash Course by Brad Traversy on YouTube
React Native Tutorial by Academind on YouTube
React Native Playlist by The Net Ninja on YouTube


Some Honourable Mentions

  • Serverless technologies such as AWS
  • Framer Motion
  • GSAP
  • HTML Canvas
  • UI/UX
  • Docker and Kubernetes

So that was list of technologies to learn this year. I'd love to see yours too! Drop a comment if you feel like sharing yours. Thanks for reading!

Discussion

pic
Editor guide
Collapse
elvstejd profile image
Elvis Tejeda

This year I'm trying to become a MERN stack developer actually! So my list looks something like this:

  • JavaScript
  • Node.js
  • SQL
  • React
  • Docker Since you are one already, any advice? Also, good luck with your learning!
Collapse
itsnitinr profile image
Nitin Ranganath Author

Wow, good luck on your journey. Regarding advices, I'd just say give yourself time and don't keep jumping between resources. That's some of the mistakes that I did. Once you feel confident, you can go for projects like a social network or e-commerce website using the whole MERN stack for a solid portfolio. Good luck!

Collapse
elvstejd profile image
Elvis Tejeda

Thank you for the advice. I'll definitely try not to rush through it and learn each topic properly.

Collapse
paras594 profile image
Paras

You should definitely try framer motion. You'll love it. I recently learned it and used it in a project and thought why I haven't learned it earlier. And it can be easily used with styled components.

By the way, Great post and all the best !!

Collapse
itsnitinr profile image
Nitin Ranganath Author

I'm absolutely going to! You're right, from the moment I visited the Framer Motion website, I've just been bewildered about all those amazing animations.

Collapse
paras594 profile image
Paras

I felt the same !! :)

Collapse
anothermindbomb profile image
Steve Flynn

I presume you want to make more money.

Learn COBOL.

It's an awful language, in the same way that commercial Forth is dreadful, but you'll make 600 quid a day, every day, for the next 200 years for any bank in any country.

When you retire at 40, with a phat pension, no debts and whatever you like parked in the garage. It's a bit like being a brickie - all you've done is one thing on top of another but when your friends are working for the next 30 years and you aren't...

Collapse
arvindpdmn profile image
Arvind Padmanabhan

GraphQL is easy to learn but requires practice to develop a graph-based mindset. Check out short intros:

  1. devopedia.org/graphql
  2. devopedia.org/rest-api-to-graphql-...
Collapse
tronixtek profile image
Tronixtek

Wow. I will have to join you in these technologies

Collapse
hamzatttech profile image
Hamzat Ridwan

I am a React developer presently, I do frontend. Moving forward, I think this road map will be suitable for me.

Collapse
yum profile image
Antariksh Verma

I was about to do the same thing except tailwind and next.js, in fact i am watching ben awad's type graphql series.

Collapse
itsnitinr profile image
Nitin Ranganath Author

That's awesome! How's it going so far?

Collapse
yum profile image
Antariksh Verma

Awesome! Following this guide which is followed by Ben in his tutorial.

Guide - typegraphql.com/

Thread Thread
itsnitinr profile image
Nitin Ranganath Author

Nice! Thanks for sharing.

Collapse
andrewbaisden profile image
Andrew Baisden

Cool list! I believe that these days MERN stack developers should also know SQL so it is good to see that you included PostgreSQL.

Collapse
jacobdev03 profile image
jacobdev03

Do you have any resources to things i should learn before mern stack?

Collapse
itsnitinr profile image
Nitin Ranganath Author

If you have some knowledge of HTML, CSS and some modern JavaScript (including ES6), you can try Traversy Media, The Net Ninja or any YouTuber of your choice to refresh your knowledge. If you're looking for something more extensive, you can try out some Udemy courses. It's important that you make the leap of faith though. You'll be stuck on vanilla JS if you try to learn each and every aspect of it. So yeah, make the jump and come back to JS when you get the time.

Collapse
jacobdev03 profile image
jacobdev03

Thank you i really appreciate

Collapse
draymck profile image
Ricardo McKenzie

I think I would like to take on javascript and some js frameworks. Node, express and react and react-native. Those have always peaked my interest but I've always been afraid of Javascript. Any pointer/s suggestions?

Collapse
itsnitinr profile image
Nitin Ranganath Author

Don't worry. You might feel uncomfortable in the initial stage and that's totally fine. Maybe you can try to code along some projects from YouTube to boost your confidence and then try to build something of your own. You don't have to learn 100% of JavaScript right when you begin. You can try Node once you're comfortable with the fundamentals and come back to plain JavaScript whenever you want to learn something new or revise.

Collapse
realtoughcandy profile image
RealToughCandy.io

That's quite the list! I've dabbled in TypeScript, might spend more time on it this year.

Collapse
itsnitinr profile image
Nitin Ranganath Author

Woah, RTC on my post. I'm really happy. It's great to see you here. Keep making those amazing and honest content :) Good luck to us with TypeScript!

Collapse
abdallahhamouda profile image
Abdallah hamouda

this year I want to learn more about
1- Machine learning
2- Automation
3-ionic
4-PostgreSQL
5-svelte

Collapse
chhabraboy profile image
Anurag Chhabra

This is literally my list though :P

Collapse
itsnitinr profile image
Nitin Ranganath Author

Hehe, that's great. We're in this together. :P

Collapse
hkara107144 profile image
hkara107144

For learning mern stack ; HTML,css,jsavascript,mongo,Express,react,nodejs.Are these enough to be mern stack developer ?

Collapse
itsnitinr profile image
Nitin Ranganath Author

Yup, sure! These are enough to get started as a MERN stack developer and make some cool projects. Eventually you'll come across new technologies that excite you and can learn them accordingly.

Collapse
manyrios56 profile image
Manuel Rios

Typescript and Graphql... absolutely to learn this year too...

Collapse
thelogicwarlock profile image
Kaemon Lovendahl

I Gotta say that I've gotten the Tailwindcss bug this year and I'm loving it so far. It's straightforward and makes sense once you get used to all the class names.