The correct path of learning React

Intro

In our days React is without doubt the most in demand front end library. While this is clearly an advantage, it can be extremely hard for beginners to grasp the correct concepts. A simple search on ‘how you build a React application’ will have a huge amount of differences between examples.
In this article we will discuss how we can avoid being overwhelmed by the quantity of information that is being throw at us.

Correct path?

How can we make sure we are on the correct path?

This depends on your background. I see 3 main situations:

1. You have no background in web development.
2. You worked before as a back end developer and want to learn a front end technology
3. You are a front end developer that worked in other frameworks (Angular, Vue)

I know that this isn’t advice that you expect, but you should learn React only if you already are number 3. Why? I will explain below.

You have no background in web development?

Learning web development is a great choice. It is rewarding, you can get a job relatively easy and end up with a salary that it is above the average. However, it is extremely important that you follow the correct steps. I see a lot of people that skipped few steps and they started to learn React without being aware of how an html page is structured or how you can style a page.

This isn’t the scope for this article, but the main idea is that you need to learn JavaScript at least before learning React.

You worked before as a back end developer and want to learn a front end technology?

Learning frontend is a great idea. You will be on the road to full stack developer which is a quite popular objective in our days. Even if you don’t want to be full stack, knowing frontend, will give you important information on how you need to structure your rest/graphql api’s.

The problem here is that if you want to learn React, it is highly advised to know a styling solution before. Why? Because having an idea how you style components has a great impact on how you need to structure your application. Think of it like you build a house. Let’s say you add walls, doors, and window. But when you want to add furniture, you see that there is a window where you wanted to place your TV. This is the main reason why you should at least be aware on how the components in React are styled.

You are a front end developer that worked in other frameworks (Angular, Vue)?

This is the ideal situation. If you already work with a Angular, Vue or even other frontend technology, they usually share the same concepts of components. You already have a preferred styling solution, You are also in luck that now you can take advantage of the latest React features.

I highly recommend to start with create-react-app. It abstracts any webpack configuration and you can focus on the main concepts of React.

Also you can skip any examples that uses old Class based component and you can focus on Functional components with hooks.

Conclusion

We haven’t got in that many technical details in this article because at a high level I wanted to make a point that React is an extremely convenient way of writing frontend applications. But that applies only if you use it well. While Angular is being opinionated, React allows you to build an application how you want. That’s why I consider the foundation much more important than React itself. You should consider React as a tool and when time comes to switch to another tool with ease.

Also please be gentle as this is my first article ever wrote😇.