Application and components
When writing software using Vue, the application will start up by creating an application instance. This instance is the main object in our Vue-based application. Once we have an instance, then we can start using components. Components are reusable UI pieces that contain three parts – a template (which is like HTML), styles, and JavaScript. Normally, when designing a frontend, we think about HTML elements – div, href, and so on – but now we need to think about components that contain all the different parts. Figure 7.2 shows an example of the login page that we rewrite using Vue.
Figure 7.2: Vue-based login
The concept of an application inside Vue can be thought of as a self-isolated container containing different components that can share data. Any web page can contain a number of applications displaying different kinds of data, and even if they are isolated, they can also share data if and when required...