I cannot understand the concept of JavaScript frameworks.

Hi there,

Pardon me for asking, but I can't understand the concept of using JavaScript frameworks, and why/when one would/should use them. Can some kind soul please explain to me something about them, and give me some advice? React, Vue, Angular, etc.

I apologize if the question sounds stupid.

Regards,
Ahmad S.

Comments

[Ari V]

Something like VueJS lets you implement JavaScript logic directly into your HTML. It abstracts away the code and let's you just do what you need to do with the data.

Example, let's say we have an array,

let fruit = ['apple', 'banana', 'orange']

How much code would you need to write to turn that into a HTML list? and to make that HTML list update dynamically every time the value of fruit changed?

This is what it looks like in Vue:

<ul>
    <li v-for="item in fruit">
</ul>

This will read and iterate over fruit and render for each one a li element.

The power comes when you update how many items there are in fruit. Vue is smart enough to update your HTML! So if we add strawberry to the list later on, it will dynamically be added.

Take a super quick crash course on Vue here: vuejs.org/v2/guide/#Declarative-Re... and you'll quickly realize how dynamic and powerful it can make your UIs and web applications.

[Ben]

From a fundamental perspective, a framework allows you to rely on millions of hours of other people's expertise instead of re-inventing the wheel for yourself.

Hypothetically, you could build a raw JavaScript application which uses no frameworks, but it would be incredibly time-consuming to code things like state management, interface components, routing, etc. If you are approaching the language as a beginner, it would take you decades to learn all of language intricacies that a framework will do for you.

So for example, you want to create a simple inventory management application where users can browse and select items. React, Vue, and Angular (and others) have simplified the process of generating interface components and making them communicate across the application and with the backend.

I am assuming you are a beginner (which is awesome, you have a long and rewarding road ahead of you) - it is essential you learn the fundamentals of the JavaScript language. Those fundamentals will probably be enough to land you a first job, but if you want to build full application front-ends, you will need to explore a framework. The major ones all have pros and cons, along with their supporters and haters.

But ultimately they are all tools which help package up the power of a programming language and solve lots of the implementation projects for you. The open source community is awesome because very very smart people have solved some complicated problems, and simplified them for you and me.

[Ahmad Shahzad]

Thank you for your response. As you said, I will stick with learning JavaScript first before bothering myself with frameworks.

I might have to bother the community here some time in the future, and hopefully, I won't try to bite off more than I can chew as I try to learn.

If you don't mind, can you recommend me some resource like a book or a tutorial that you think might be beginner-friendly? For JavaScript. I am currently looking at FreeCodeCamp.

Thank you,
Ahmad S.

[Ben]

You are on the right path. FreeCodeCamp is a great resource for beginners.

The best thing you can do is practice every single day. With time, confusing concepts will look less foreign and you will understand them with ease. The best way to learn a foreign language is to immerse yourself and try to communicate (both culturally, and in programming). Fortunately, the world of developers is very friendly and we want beginners to feel welcome and thrive, because we all know how overwhelming the start can be.

I'm not an educator, so I don't know what the best way to learn, other than persistence and drive - you will find the resources you need with enough searching. However, this roadmap gives you a decent picture of all of the paths you can take. Keep in mind that very few people are proficient in this whole chart, but it gives you a big picture of the industry:

freecodecamp.org/news/2019-web-dev...

best of luck Ahmad!

[Ahmad Shahzad]

Thank you for your response. I have bookmarked the roadmap as it has a lot of information that I won't be able to digest in one sitting or little time.

I will now return to my exercise on FreeCodeCamp. Good luck, me.

Thank you,
Ahmad S.