Vue.js The Most Fundamental Idea

Vue.js is Declaritive

Declaritive programming — From Wikipedia:

… declaritive programming is a programming paradigm that expresses the logic of a computation without describing its control flow.

In more straightforward terms, declaritive programs say what should happen, rather than how it should happen.

In contrast, imperitive programming specifically lists the steps to perform a function.

Vue.js Declaritive Manifestion

Rather than, for example, using vanilla Javascript to step-by-step: find objects in the DOM, update those objects, etc. — Vue.js takes a simplified, abstracted approach.

Modify HTML tags and structure with special attributes.
Use Vue.js to apply functionality to the HTML with abstracted functions.

An Example of Vue.js Declaritive Rendering

Extracted directly from the guide at vuejs.org — this example provides a most basic demonstration of declaritive rendering.

HTML

<div id="app">
  {{ message }}
</div>

var app = new Vue({
  el: '#app',
  data: {
    message: 'Hello Vue!'
  }
})

The “declartive'” part of declaritive rendering is written into the HTML of the example.

In English, it says:

“Put the message into the app”

The accompanying Javascript carries out the duties of making it happen.