موجه التطبيق (App Router)
يقدم موجه التطبيق (App Router) في Next.js نموذجًا جديدًا لبناء التطبيقات باستخدام أحدث ميزات React مثل مكونات الخادم (Server Components)، البث مع التعليق المؤقت (Streaming with Suspense)، و إجراءات الخادم (Server Actions).
ابدأ باستخدام موجه التطبيق عن طريق إنشاء صفحتك الأولى.
الأسئلة الشائعة
كيف يمكنني الوصول إلى كائن الطلب (request object) في التخطيط؟
لا يمكنك عمدًا الوصول إلى كائن الطلب الخام. ومع ذلك، يمكنك الوصول إلى الرؤوس (headers) و ملفات تعريف الارتباط (cookies) من خلال دوال خاصة بالخادم فقط. يمكنك أيضًا تعيين ملفات تعريف الارتباط.
التخطيطات (Layouts) لا تعيد التصيير. يمكن تخزينها مؤقتًا وإعادة استخدامها لتجنب الحسابات غير الضرورية عند التنقل بين الصفحات. من خلال منع التخطيطات من الوصول إلى الطلب الخام، يمكن لـ Next.js منع تنفيذ التعليمات البرمجية للمستخدم التي قد تكون بطيئة أو مكلفة داخل التخطيط، مما قد يؤثر سلبًا على الأداء.
هذا التصميم يفرض أيضًا سلوكًا متسقًا ومتوقعًا للتخطيطات عبر الصفحات المختلفة، مما يبسط عملية التطوير والتصحيح.
اعتمادًا على نمط واجهة المستخدم الذي تقوم ببنائه، المسارات المتوازية (Parallel Routes) تتيح لك عرض صفحات متعددة في نفس التخطيط، وللصفحات حق الوصول إلى مقاطع المسار (route segments) وكذلك معلمات البحث في URL.
كيف يمكنني الوصول إلى URL في صفحة؟
بشكل افتراضي، الصفحات هي مكونات خادم (Server Components). يمكنك الوصول إلى مقاطع المسار من خلال خاصية params ومعلمات البحث في URL من خلال خاصية searchParams لأي صفحة معينة.
إذا كنت تستخدم مكونات العميل (Client Components)، يمكنك استخدام usePathname، useSelectedLayoutSegment، و useSelectedLayoutSegments للمسارات الأكثر تعقيدًا.
علاوة على ذلك، اعتمادًا على نمط واجهة المستخدم الذي تقوم ببنائه، المسارات المتوازية (Parallel Routes) تتيح لك عرض صفحات متعددة في نفس التخطيط، وللصفحات حق الوصول إلى مقاطع المسار وكذلك معلمات البحث في URL.
كيف يمكنني إعادة التوجيه من مكون خادم (Server Component)؟
يمكنك استخدام redirect لإعادة التوجيه من صفحة إلى URL نسبي أو مطلق. redirect هو إعادة توجيه مؤقتة (307)، بينما permanentRedirect هو إعادة توجيه دائمة (308). عند استخدام هذه الدوال أثناء بث واجهة المستخدم، ستقوم بإدراج وسم meta لتنفيذ إعادة التوجيه على جانب العميل.
كيف يمكنني التعامل مع المصادقة (authentication) باستخدام موجه التطبيق؟
إليك بعض حلول المصادقة الشائعة التي تدعم موجه التطبيق:
كيف يمكنني تعيين ملفات تعريف الارتباط (cookies)؟
يمكنك تعيين ملفات تعريف الارتباط في إجراءات الخادم (Server Actions) أو معالجات المسار (Route Handlers) باستخدام دالة cookies.
نظرًا لأن HTTP لا يسمح بتعيين ملفات تعريف الارتباط بعد بدء البث، لا يمكنك تعيين ملفات تعريف الارتباط من صفحة أو تخطيط مباشرة. يمكنك أيضًا تعيين ملفات تعريف الارتباط من البرمجيات الوسيطة (Middleware).
كيف يمكنني بناء تطبيقات متعددة المستأجرين (multi-tenant apps)؟
إذا كنت تريد بناء تطبيق Next.js واحد يخدم مستأجرين متعددين، فقد قمنا ببناء مثال يوضح بنيتنا الموصى بها.
كيف يمكنني إبطال ذاكرة التخزين المؤقت لموجه التطبيق؟
هناك طبقات متعددة من التخزين المؤقت في Next.js، وبالتالي، طرق متعددة لإبطال أجزاء مختلفة من الذاكرة المؤقتة. تعلم المزيد عن التخزين المؤقت.
هل هناك أي تطبيقات شاملة مفتوحة المصدر مبنية على موجه التطبيق؟
نعم. يمكنك الاطلاع على Next.js Commerce أو Platforms Starter Kit للحصول على مثالين أكبر لاستخدام موجه التطبيق مفتوحة المصدر.