Next.js Intercepting Routes Modal example

An example showing Next.js 13's Intercepting Routes feature.

Navigating into the photo page client-side will open a modal instead of a full page, while still updating the URL. Navigating directly into the photo page URL or refreshing the page while the modal is open will bring up the photo page instead.

View Source
Aerial view of the Brisbane skyline and the Brisbane River at golden hour
Mount Fuji rising above a lake with pink cosmos flowers in the foreground
A person in a reflective mirror dress roller skating on the Hollywood Walk of Fame
A woman in a white top and black shorts performing a handstand on a terrace
Cinderella Castle in Tokyo Disneyland with flowers in the foreground under bright sunlight
Three smooth metallic discs floating at an angle against a light grey background
Iridescent soap film ribbons with blue and gold highlights on a grey background
Person photographs small pictures on a white wall with phone
A person in a dark outfit walking up white stairs at Masjid Budi Guna