مجموعات المسارات (Route Groups)

في دليل app، يتم عادةً تعيين المجلدات المتداخلة إلى مسارات URL. ومع ذلك، يمكنك تحديد مجلد كـ مجموعة مسارات (Route Group) لمنع تضمين المجلد في مسار URL الخاص بالمسار.

هذا يسمح لك بتنظيم مقاطع المسار وملفات المشروع في مجموعات منطقية دون التأثير على هيكل مسار URL.

تعد مجموعات المسارات مفيدة لـ:

تنظيم المسارات في مجموعات مثلًا حسب قسم الموقع، الغرض، أو الفريق.
تمكين التخطيطات المتداخلة في نفس مستوى مقطع المسار:
- إنشاء تخطيطات متداخلة متعددة في نفس المقطع، بما في ذلك تخطيطات جذر متعددة
- إضافة تخطيط إلى مجموعة فرعية من المسارات في مقطع مشترك

الاصطلاح

يمكن إنشاء مجموعة مسارات عن طريق تضمين اسم المجلد بين قوسين: (اسم_المجلد)

أمثلة

تنظيم المسارات دون التأثير على مسار URL

لتنظيم المسارات دون التأثير على URL، قم بإنشاء مجموعة لإبقاء المسارات ذات الصلة معًا. سيتم حذف المجلدات الموجودة بين قوسين من URL (مثل (marketing) أو (shop)).

تنظيم المسارات باستخدام مجموعات المسارات

على الرغم من أن المسارات داخل (marketing) و (shop) تشترك في نفس التسلسل الهرمي لـ URL، يمكنك إنشاء تخطيط مختلف لكل مجموعة عن طريق إضافة ملف layout.js داخل مجلداتها.

اختيار مقاطع محددة لتطبيق تخطيط عليها

لاختيار مسارات محددة لتطبيق تخطيط عليها، قم بإنشاء مجموعة مسارات جديدة (مثل (shop)) وانقل المسارات التي تشترك في نفس التخطيط إلى المجموعة (مثل account و cart). المسارات خارج المجموعة لن تشترك في التخطيط (مثل checkout).

إنشاء تخطيطات جذر متعددة

لإنشاء عدة تخطيطات جذر، قم بإزالة ملف layout.js في المستوى الأعلى، وأضف ملف layout.js داخل كل مجموعة مسارات. هذا مفيد لتقسيم التطبيق إلى أقسام لها واجهة مستخدم أو تجربة مختلفة تمامًا. يجب إضافة علامات <html> و <body> إلى كل تخطيط جذر.

في المثال أعلاه، كل من (marketing) و (shop) لديهما تخطيط جذر خاص به.

معلومة مفيدة:

تسمية مجموعات المسارات ليس لها أهمية خاصة بخلاف التنظيم. لا تؤثر على مسار URL.

المسارات التي تتضمن مجموعة مسارات يجب ألا تحل إلى نفس مسار URL مثل المسارات الأخرى. على سبيل المثال، بما أن مجموعات المسارات لا تؤثر على هيكل URL، فإن (marketing)/about/page.js و (shop)/about/page.js سيحلان إلى /about وسيتسببان في خطأ.

إذا كنت تستخدم عدة تخطيطات جذر دون ملف layout.js في المستوى الأعلى، يجب تعريف ملف page.js الرئيسي في إحدى مجموعات المسارات، على سبيل المثال: app/(marketing)/page.js.

التنقل بين تخطيطات جذر متعددة سيؤدي إلى تحميل كامل للصفحة (بدلاً من التنقل من جانب العميل). على سبيل المثال، التنقل من /cart الذي يستخدم app/(shop)/layout.js إلى /blog الذي يستخدم app/(marketing)/layout.js سيؤدي إلى تحميل كامل للصفحة. هذا ينطبق فقط على تخطيطات الجذر المتعددة.