You took upon yourself to learn React during these lockdown months. I applaud you for choosing to make this investment in yourself.

React is a JavaScript library for building user interfaces. Currently, it is one of the most popular front-end frameworks, with no view of changing in the near future. Thus, if you are looking for a front-end job, or frankly any web development position in 2020, knowing React is a huge asset if not a must-have.

But do not just take my word for it. Let’s check my opinion against the data from a few respectable sources. On the graph below taken from State of JS Survey, you can see that although there are other JS frameworks that gained popularity in the recent years, such as Vue or Svelte, React is still by far the most popular framework:

The same survey also provides the overview of Usage by Company Size as well as the Salary Range:

With that in mind, we can compare it now against the preferences of the developers themselves. We can get that data from npm stats. Npm is a package manager or in a more layman’s terms a repository of various packages that we as developers can use in our projects. I plotted a chart to show the popularity of four front-end frameworks in the last 3 years:

You can see that React is clearly a winner here.

That is also confirmed in Developer Survey Results from 2019 conducted by Stack Overflow. React is the first on the list of the most loved web frameworks.

Hopefully, all this data provided enough insights to confirm that you made the right decision to learn React. I assume you already have some decent JS skills, as it is definitely a prerequisite in order to master React.

Your Roadmap to Master React

Without further ado, let’s design a roadmap for you to learn React in the next couple of months.

The following resources have been picked after a lot of research as well as trial and error. Please note there is no affiliation involved here. There are a lot of other great tutorials that I completed when learning React for the first time over a year ago. However, since React has changed a lot since it emerged, I believe the list below will equip you with the most up to date skills.

If you follow the four tutorials listed below, you should get a great foundation and understanding of the most important concepts, as well as to pick up the most up-to-date trends and best practices that emerged in the last couple of years. If you really take this task seriously, you will go from the beginner to professional in no time:

ReactJS.org Tutorial

React has excellent documentation and many tutorials written by the developers who work on the framework day to day. I’d recommend you thoroughly examine that site, but since this task itself can be quite daunting, the best place to start is the Intro to React Tutorial. By building your own implementation of tic-tac-toe game you will be ready to dive deeper into React in a day or two. It will answer your questions about what React is, provide overview of foundational concepts and will give you a fun and practical way to experiment with the framework itself.

This tutorial was written by the React team. I highly recommend you follow all of them, but especially blog of Dan Abramov. It is dedicated to React and I cannot recommend it highly enough if you really want to understand all the React concepts in detail when you are a little further along your React journey.

A Beginners Guide to React Introduction

Kent C. Dodds is one of the most influential people in the React world. He has many tutorials, workshops, talks and it is one of the people, whose work you should really follow closely. You can find out more about him on his blog as well as find some other great tutorials.

This egghead.io tutorial from Kent is, in my humble opinion, the most succinct and yet detailed course out there. If I were to pick just one tutorial for you to make sure you get all the foundations as well as overview of the most recent techniques, it would be this one. Plus, it is completely free.

The Road to React

I love this site. You will find here absolutely everything related to React, from the basic concepts, through testing and becoming advanced in React. It has the whole roadmap designed and ready for you to follow. It is a paid book, but you can choose from various options from just The Bare Essentials to The Professional. A lot of industry leaders are recommending it, and I do think it is worth your money. But it is third on my list, because frankly you do not have to spend any money to learn React if you do not want to.

The React Handbook by Flavio Copes

I recommend you subscribe to Flavio’s newsletter. I really like the structure of his tutorials. They are always to the point, practical and well… short! One concept at a time. He writes about all kind of stuff, but with most focus on the JavaScript world. He has various Handbooks that are free for you to follow, and there is one dedicated to React too.

React on Scrimba

This one has only recently made onto my list. I absolutely love that it is free and the way it is structured. The fact it is beautifully designed is also a plus. In 58 relatively short videos it teaches you how to write modern day react, explain all the concepts and shows you where to go next. It is a must-do and definitely won’t regret picking this one up.

Having all these resources in front of you now, I hope I saved you some time searching the web to figure out which tutorial is best. I would follow these tutorials in the order provided. If you are short on time, you can pick just two of them and you will be on your way to take the next step in your React learning journey, i.e. building your own applications. There is no substitute for applying your skills onto the real projects. So do get your hands dirty on some suitable projects on platforms such as Helpful Engineering or freeCodeCamp.org.

All you need to do now is to create a schedule and timeline for yourself. Create a Trello board. Make deadlines to keep yourself accountable. Find a place to keep all your notes and perhaps set up a couple of mind maps to enhance your learning.

Best of luck on your journey! 🤞🤞🤞

Please note this article was originally written for my blog.