Прежде чем разбираться с конкретными конструкциями Vue.js, свойствами, методами, и.т.д., важно разобраться с некоторыми базовыми определениями и понятиями, которые нам важно понимать и знать в самом начале.

Первое понятие, на котором стоит остановиться - это понятие шаблона. 

Как мы знаем, Vue.js - это некий javascript объект и этот объект взаимодействует с неким корневым элементом. Все, что будет находиться внутри этого HTML-элемента называется шаблоном или template. 

Т.е. template - это тот внешний вид, который будет у нас отображаться в браузере, когда Vue будет визуализировать наше приложение. 

Т.е. у нас есть следующие основные части во Vue: разметка (шаблон), объект Vue, данные, которые есть в этом объекте. Это такие независимые части, которые будут у нас взаимодействовать. 

Связь между этими частями организуется с помощью специальных атрибутов, которые добавляются к элементам шаблона и эти атрибуты начинаются с v-команда = значение.

Такие атрибуты называются директивы. Это некие управляющие конструкции, которые позволяют нам выполнять какие-то действия. 

Давайте двигаться дальше и познакомимся с несколькими полезными директивами, которые мы будем использовать.