Let's build a new feature for the Vuebnb frontend app using components. As you'll recall from previous chapters, each of our mock data listings has four different images, and we're passing the URLs to the frontend app.
To allow the user to peruse these images, we're going to create an image carousel. This carousel will replace the static image that currently occupies the modal window that pops up when you click the header of a listing.
Begin by opening the app view. Remove the static image and replace it with a custom HTML element
<div class="modal-content"> <image-carousel></image-carousel> </div>
A component can be referred to in your code by a kebab-case name such as
my-component, a PascalCase name such as
MyComponent, or a camelCase name such as
myComponent. Vue sees these all as the same component. However, in a DOM or string template, the component should always be kebab-cased. Vue doesn't enforce...