Overview over all layouts and pages
Pages are in Vue.js the website routes, and implement a single web page. Vuetify uses so-called layouts to provide elements which should be available on all pages; to make the website flexible and dynamic, different layouts can be defined and used on different pages.
The Vuetify project scaffold comes with the unplugin-vue-router pre-installed which allows setting up the structure of a website by just creating the respective vue files in the pages folder. By creating sub-folders also parameter loaded pages can be setup.
The folder structure for this website looks like this:
pages
├── 404.vue
├── About.vue
├── Contact.vue
├── Hashers.vue
├── index.vue
├── Info.vue
├── locations
│ ├── [id].vue
│ └── index.vue
├── Login.vue
├── runs
│ ├── [id].vue
│ └── index.vue
└── SignInSheet.vue
layouts
├── default.vue
└── empty.vue