✳flâneur — a map of the web's best reading

Routing: Intercepting Routes | Next.js

nextjs.org · 467 words · saved by 1 readers

Intercepting routes allows you to load a route from another part of your application within the current layout. This routing paradigm can be useful when you want to display the content of a route without the user switching to a different context. For example, when clicking on a photo in a feed, you can display the photo in a modal, overlaying the feed. In this case, Next.js intercepts the /photo/123 route, masks the URL, and overlays it over /feed. However, when navigating to the photo by clicking a shareable URL or by refreshing the page, the entire photo page should render instead of the modal. No route interception should occur. Intercepting routes can be defined with the (..) convention, which is similar to relative path convention ../ but for segments. You can use: For example, you can intercept the photo segment from within the feed segment by creating a (..)photo directory. Note that the (..) convention is based on route segments, not the file-system. Intercepting Routes can be

This page is also available as Markdown at /docs/app/api-reference/file-conventions/intercepting-routes.md . For an index of Next.js documentation , see /docs/llms.txt . Copy page Intercepting Routes Last updated June 16, 2025 Intercepting routes allows you to load a route from another part of your application within the current layout. This routing paradigm can be useful when you want to display the content of a route without the user switching to a different context. For example, when clicking on a photo in a feed, you can display the photo in a modal, overlaying the feed. In this case, Next

Explore this link on the map →

related reading