Intercepting Routes
React 🔴 SeniorDéfinition
Permet d'intercepter une route pour afficher son contenu dans le layout actuel (ex: modale) au lieu de naviguer vers la page complète.
Analogie
Comme un aperçu rapide au survol : tu vois le contenu sans quitter ta page, mais l'URL directe montre la version complète.
Exemple de code
// app/@modal/(.)photo/[id]/page.tsx
// Le (.) intercepte /photo/[id]
export default function PhotoModal({ params }) {
return (
<Modal>
<Photo id={params.id} />
</Modal>
);
}
// URL directe /photo/123 -> page complete
Cas d'usage
Photos en modale (Instagram-like), aperçu de produit, détail de notification sans quitter le feed.