DEV Community

loading...

Discussion on: I cannot understand the concept of JavaScript frameworks.

Collapse
arivictor profile image
Ari V • Edited

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.