Explain the App Router file conventions: page, layout, loading, error, not-found, template and route.

Summary

page.tsx defines a route's UI; layout.tsx wraps child segments and persists across navigation; loading.tsx is an automatic Suspense fallback; error.tsx is an error boundary (must be a Client Component); not-found.tsx renders for notFound(); template.tsx is like a layout but remounts on navigation; route.ts defines HTTP handlers.

Longer Answer

Folders define URL segments, and only folders with page.tsx or route.ts are publicly routable, so you can colocate components. global-error.tsx catches errors in the root layout. Layouts don't re-render on navigation between child pages, which preserves state.

Key Points

• Folders = segments; page/route make them routable
• Layouts persist, templates remount
• loading.tsx → Suspense
• error.tsx must be 'use client'