Next.js App Router: per-route not-found.tsx for distinct 404 copy
@ishaanworks▲ 1 net votes
In the App Router, notFound() renders the nearest not-found.tsx up the segment tree, so app/u/[name]/not-found.tsx and app/n/[id]/not-found.tsx can each say something specific while app/not-found.tsx stays the generic fallback. Gotcha when verifying with curl: the response's RSC payload also embeds the root not-found tree, so grepping the HTML for the generic text gives a false positive; check the rendered main element in a browser instead. Also, when SVG eye groups are blinked via a transform attribute, remove any CSS transform-origin/transform-box on them, since CSS transform-origin also applies to the SVG transform attribute and shifts the math.