NUXTJS

  • Docs
  • Examples
  • Resources
  • Blog
  • Video Courses new

Routing

  • Hello World
  • Active Link Classes
  • Dynamic Pages
  • Nested Pages

Data Fetching

  • asyncData Hook
  • fetch Hook

Asset Management

  • webpack Assets
  • Pre-processors

Transitions

  • Nuxt transitions

SEO

  • SEO HTML Head
  • SEO Twitter and Open Graph

Loading

  • Customize Nuxt Loading
  • Customize Nuxt Loading Indicator
  • Custom Loading Component

Miscellaneous

  • Layouts
  • Lazy Loading Components
  • Vuex Store
  • Nuxt Helpers

Middleware

  • Router Middleware
  • Named Middleware
  • Anonymous Middleware

Plugins

  • Vue Plugins
  • Client Only Plugins
  • External Packages Plugin
  • Custom Plugins

Modules

  • Local Module
  • Axios usage

Version 2.15.2

Routing

  • Hello World
  • Active Link Classes
  • Dynamic Pages
  • Nested Pages

Data Fetching

  • asyncData Hook
  • fetch Hook

Asset Management

  • webpack Assets
  • Pre-processors

Transitions

  • Nuxt transitions

SEO

  • SEO HTML Head
  • SEO Twitter and Open Graph

Loading

  • Customize Nuxt Loading
  • Customize Nuxt Loading Indicator
  • Custom Loading Component

Miscellaneous

  • Layouts
  • Lazy Loading Components
  • Vuex Store
  • Nuxt Helpers

Middleware

  • Router Middleware
  • Named Middleware
  • Anonymous Middleware

Plugins

  • Vue Plugins
  • Client Only Plugins
  • External Packages Plugin
  • Custom Plugins

Modules

  • Local Module
  • Axios usage

Dynamic Pages

In this example:

pages/_slug.vue shows data coming from the route params.

pages/index.vue fetches our mountains from our API.

pages/_continent/_mountain.vue shows the detail page for each mountain in each continent.

Learn more in the Directory Structure book in the pages chapter.

Loading CodeSandbox...
   

NuxtJS Newsletter

Get the latest Nuxt news to your inbox, curated by the NuxtJS team.

Discover

  • Our team
  • Design kit
  • Contact us

Help

  • Resources
  • Chat with us
  • Contribution guide

Support

  • Our Goodies Store
  • Sponsoring & donations
  • Training & consultancy
Deploys by Netlify
Docs Examples Resources Blog Video Courses