App Router இல் கோப்பு-அடிப்படையிலான திசைவழித்தல் எவ்வாறு செயல்படுகிறது?

Question

Accepted Answer

App Router இல், **`app/` உள்ளே இருக்கும் கோப்புறை கட்டமைப்பு உங்கள் வழிமுறைகளை வரையறுக்கிறது** — எழுத வேண்டிய திசைவழிப்பு கட்டமைப்பு இல்லை. ஒவ்வொரு கோப்புறையும் ஒரு URL பிரிவாகும், மேலும் அதன் உள்ளே இருக்கும் சிறப்பு கோப்புகள் அந்த பிரிவு என்ன ரெந்டர் செய்கிறது என்பதை வரையறுக்கிறது. ## கோப்புறைகள் = URL பிரிவுகள் ```text app/ page.tsx → / about/page.tsx → /about blog/page.tsx → /blog blog/[slug]/page.tsx → /blog/:slug (dynamic segment) shop/(sale)/page.tsx → /shop (route group — parentheses don't add to URL) ``` ## சிறப்பு கோப்புகள் ஒவ்வொரு கோப்புறையும் সংரక்ষிக்கப்பட்ட கோப்பு பெயர்களைக் கொண்டிருக்க முடியும், ஒவ்வொன்றும் ஒரு குறிப்பிட்ட பங்கு உடையது: ```text page.tsx → the route's UI (REQUIRED to make a segment routable) layout.tsx → shared wrapper that persists across child routes loading.tsx → loading UI (auto-wraps the page in ) error.tsx → error boundary for the segment not-found.tsx→ 404 UI route.ts → an API endpoint (instead of a page) ``` ## இயங்கும் பிரிவுகள் ```tsx // app/blog/[slug]/page.tsx → matches /blog/hello, /blog/anything export default function Post({ params }: { params: { slug: string } }) { return

Post: {params.slug}

; // params.slug = "hello" } ``` சதுர வளைப்புகள் `params` மூலம் பக்கத்திற்கு அனுப்பப்படும் ஒரு இயங்கும் அளவுருவை உருவாக்குகின்றன. மாறுபாடுகள்: `[...slug]` (பிடி-அனைத்து), `[[...slug]]` (விருப்பமான பிடி-அனைத்து). ## வழிமுறை குழுக்கள் மற்றும் ஸ்தாபனம் ```text app/(marketing)/about/page.tsx → /about (the (marketing) folder is ignored in the URL) ``` வட்ட வளைப்புகள் **வழிமுறை குழுக்களை** உருவாக்குகின்றன கோப்புகளை ஸ்தாபிக்க அல்லது URL ஐ பாதிக்காமல் வெவ்வேறு லेआউட்களை பயன்படுத்த। ## ஏன் முக்கியம் கோப்பு-அடிப்படையிலான திசைவழித்தல் URL கட்டமைப்பை கோப்பு மரத்திலிருந்து தெளிவாக்குகிறது — பராமரிக்க மற்றும் ஒத்திசைவில் வைத்திருக்க வேண்டிய மையப் திசைவழி கட்டமைப்பு இல்லை. சிறப்பு கோப்பு பெயர்களை (`page`, `layout`, `loading`, `error`, `route`) மற்றும் சதுர வளைப்பு மரபுகளை (`[param]`, `[...catchAll]`, `(group)`) அறிந்து கொள்வது எந்தவொரு App Router பயன்பாட்டையும் கட்டமைப்பதற்கான முக்கிய சொல்லகராதிகளாகும்.