0Pricing
Frontend Academy · Lesson

File-based Routing and Auto-imports

Create pages in the pages/ directory for automatic routing, understand dynamic segments, and rely on Nuxt's auto-imports for components and composables.

Nuxt 3 — Vue's SSR Framework

Nuxt 3 is to Vue what Next.js is to React: an opinionated framework for SSR, SSG, file-based routing, data fetching, and a deep auto-import system.

pages/ Directory

Drop Vue components in pages/ and they become routes — no router configuration needed.

pages/
  index.vue        // route: /
  about.vue        // route: /about
  blog/
    index.vue      // route: /blog
    [slug].vue     // route: /blog/:slug
  users/
    [id]/
      profile.vue  // route: /users/:id/profile

All lessons in this course

  1. File-based Routing and Auto-imports
  2. useFetch and useAsyncData
  3. Nuxt Modules: Image Auth i18n
  4. Deployment: Static vs SSR
← Back to Frontend Academy