In the last chapter, we learned about Vue.js components and converted Vuebnb to a component-based architecture. Now that we've done this, we can easily add new pages to our app using Vue Router.
In this chapter, we'll create a home page for Vuebnb, including a gallery of clickable thumbnails that showcase the full set of mock listings.
Topics covered in this chapter:
- An explanation of what router libraries are and why they are a critical part of single-page applications
- An overview of Vue Router and its main features
- Installation and basic configuration of Vue Router
- Using the
RouterViewspecial components to manage page navigation
- Setting up AJAX with Vue to retrieve data from the web service without a page refresh
- Using route navigation guards to retrieve data before a new page is loaded