Marvelous routes in a single-page application

Now, let’s take a look at the default setup of the application, because we’ve pre-installed the app to use vue-router. This configured the app with a couple of things:

• We have an index.ts file in the router folder
• In the views folder, we have two components called HomeView.vue and AboutView.vue
• In App.vue, we have some components called RouterLink and RouterView

That’s how routes are tied together. Let’s take a look at each of them.

The contents of the router folder define and configure the routes for the application. Routes define the different paths in your application and the components that should be rendered when those paths are accessed. Each route is represented as an object with properties such as path, name, and component.

The path property specifies the URL path, and the component property specifies the Vue component to render. The name is not required and more meant as...