File-system routing and the app directory

The App Router maps folders to URL segments and reserved filenames to behaviour. Once you can read a folder tree as a set of routes, most of the framework stops being magic.

Lesson 1.15m 50sIntermediate18.2k students

Chapters

5:50
  1. 0:00Introduction to Next.js Routing
  2. 0:16Setting Up a New Next.js Project
  3. 0:43Understanding File-Based Routing
  4. 1:26Creating Your First Route
  5. 3:02Implementing Additional Routes
  6. 4:56Handling Non-Existing Routes
  7. 5:17Conclusion and Next Steps

What this lesson covers

  • Map folders and page files to URL segments
  • Use route groups to organise without affecting the URL
  • Recognise the reserved files: page, layout, loading, error, not-found

This lesson sits in Routing and Layouts, part of Next.js App Router in Depth. It assumes what came before it and leads directly into the next lesson in the module.

In this lesson you will

  • Map folders and page files to URL segments
  • Use route groups to organise without affecting the URL
  • Recognise the reserved files: page, layout, loading, error, not-found

Resources