The two core concepts of Vue.js are:

1. Data driven view.

   In Vue.js the state of the DOM is just a reflection of the data state. You connect the two together by creating "ViewModel" objects. When you change the data, the DOM updates automatically. The actual DOM manipulations are encapsulated inside "directives", which are objects that observes an expression, and react whenever the result of that expression changes.

   <span v-text="message"></span>

   Here v-text is a directive: its job is to update the text inside the <span> whenever the message property in your data changes.

   This might be confusing before you actually start to try it, but the core idea is simple (albeit very important): when you want your view to change, don't think in the imperative mindset of manually updating the DOM with jQuery; instead, think about how to express the relationship between your view and the data declaratively inside the template. Once you declare that relationship, Vue will help you do the rest.

2. Components.

   UI can get large and complex, and we want to isolate a complex application into small, decoupled units so that they are easier to understand and maintain. In Vue.js, we achieve this with components - which are essentially ViewModels with pre-defined behaviors. Think of your UI as a tree of components. Vue.js provides an API to define, compose and communicate data between components.

Glad to know that you are considering Vue.js. It is indeed quite compact and easy to learn JavaScript library dedicated to only View layer. Basically it connects view and model via two way data binding. You can focus on the following while getting started:

• Two-way data binding
• Event handling
• Data rendering
• Filtering and ordering

Good luck!!