Before learning any Java Script Framework....

Before learning any Java Script Framework....

Are you planning to start learning any front-end framework and confused which one to pick? Then this article is for you.

Hey! What's going on guys.

In this article, I want to talk a little bit about learning a front-end JavaScript framework such as Angular, React or Vue. If you start learning web development, most probably, your road map would be learning HTML, CSS and Java Script first and immediately choose some front-end framework and proceed further. At this stage, there is a lot of confusion that you might face due to the available options in the market. We have Angular by Google, React by Facebook and Vue, which is somewhat less popular, but you get the idea. I am often asked by so many of my juniors who is about to learn them and they are very anxious about making a decision of picking a framework as if it is a life and death issue. They will even feel that it is a devastating mistake if they choose the wrong one.

The Reality

Hold up. Wait a minute! Let me spoil your anxiety and confusion right now. Because whatever you think is not correct. Believe me!

Even though there are different front-end frameworks, most of them do the same thing. In addition, yeah of course, every framework will do it in a different way, they have different syntax and different build process, but the overall concepts are pretty much the same. I will talk about it a little later but, I think the most important thing that you have to worry about is do you know enough Java Script? You need to focus on learning the core fundamentals of Java Script. I don’t just mean what a variable is and what a function is and what an array is, of course you need to know that but go further and learn at least ES6. You want to look at Promises, HTTP requests, higher order array methods like map, filter, reduce etc.

The reason I am saying this is when you talk about frameworks, they are basically Java Script frameworks so, JS is at its heart. I have actually written many articles explaining different high-level things in a very easy way. Here are the links:

  1. 8 Must Know JavaScript Array Methods - No Fuss!
  2. Let us finally understand var, let and const in JavaScript!
  3. Convert Your Traditional Functions into Arrow Functions in 3 Simple Steps
  4. Understanding Hoisting - A Weird Behavior of JavaScript 😬
  5. Looping over Arrays: for vs. for-in vs. .forEach() vs. for-of

The biggest Myth

Going back to the point, far too many people just jump into learning a framework too quickly and there are few problems with that, one of them is it is hard to distinguish what is part of a framework and what is actually Java Script. For example, the map() method which is a JavaScript high order array method that's used in react to basically loop through an array and then output a list in JSX. Many people that just jump into react too quickly think that map is part of react but it’s not, it’s Java Script.

Due to this, people think it is so important on which framework to choose because they think every framework is so different like if they learn react and somehow one-day react goes away, they will need to spend a year learning another framework like Angular. It is a myth. When in reality, if you just really know JavaScript well you can switch frameworks very easily and it's not a big deal so just keep that in mind. I know there are different videos in YouTube related to something like React versus Angular and what should you choose etc. They make drama out of picking a framework, it’s not needed. What's needed here is learning JavaScript and keep up to date with latest additions into the language every year.

Another way to really sharpen your skills is being good at algorithms. This is kind of optional in a front-end framework because not everyone like algorithms, even I don’t like them but I do see how they come in handy while writing logics in the most efficient way when there are multiple ways of achieving that solution.

What you should really care about

As far as a framework concerned, there are only two important concepts that you need to know about. Those are:

  • What is a component?
  • What is a state?

Components

Components are just encapsulated pieces of your user interface. For instance, if we want to build a home page containing a nav bar, body, some cards and a footer as shown below.

image.png

In a front-end framework, each of them are considered as a component of home page.

State and State Management

A state is a representation of a system in a given time. State refers to the data stored in Application in the form of a string, arrays, object, etc.

State management is a method of managing the state. As an application grows, so does the complexity of managing the state. In a big application where you have a good number of views/components, managing their state is a big pain. The main job of any UI Library or framework is to take your application state and turn it into DOM nodes, that's why arranging state in a better way lifts the overall health of the application.

I like to think of my application as a bunch of components and then a cloud that that kind of hovers above the components - that is my state and the state can rain down data into components that need it.

Conclusion

Therefore, the main conclusion is whatever the framework you want to choose, just choose it and start with it. However, the only rule is you need to be reasonably good at core Java Script. In addition, going forward, do not mind about what people are saying about the framework you pick up. Because as far as you understand core concepts of java Script and what does any framework do for you, it’s very easy to learn other one. So, that’s pretty much it for today. Hope you learned something new today.

Did you find this article valuable?

Support Devalla Sai Charan by becoming a sponsor. Any amount is appreciated!