Pages and Components
Learn how to distinguish between pages and components in this lesson.
Pages
The first additional directory that we’ll cover is pages. They are significant because, along with creating our app’s views, they are also a key part of navigating our project. Examples of pages could be the “Home,” “About Us,” and “Contact Us,” pages or any view we might switch to.
How this compares with Vue.js
The pages folder in Vue.js is often called views. Typically, the contents of the views folder are simply for organizing our pages for routing (i.e., switching between pages). We would then need to install and set up a routing package and inform the router which view to display for each URL. For example, https://myproject.com/about will render the contents of the About.vue file. This is all set up in a configuration file.
Nuxt does this for us!
With Nuxt, we don’t need to worry about this configuration. Any .vue files we add to the pages directory will be automatically assigned a URL. For example, pages/about.vue will be displayed when we visit https://myproject.com/about.