Multi-word component names

Our existing and future HTML elements are single words (for example, article, main, body, and so on), so to prevent conflicts from occurring, we should use multi-words when naming our components (except for the root app components). For example, the following is considered bad practice:

// .js
Vue.component('post', { ... })

// .vue
export default {
  name: 'post'
}

 The component's name should be written as follows:

// .js
Vue.component('post-item', { ... })

// .vue
export default {
  name: 'PostItem'
}