مفهوم الـ Middleware في Next.js 💡
.
.
أكيد قابلت سيناريو إنك محتاج تتحكم في الـ requests اللي داخلة لموقعك أو تعمل checks معينة قبل ما الـ user يشوف الـ page. مثلًا:

- محتاج تمنع user مش عامل login إنه يدخل صفحة معينة.
- أو تعمل redirect لو user مش عنده صلاحيات.
- أو حتى تضيف headers أو تعمل logging لكل request.

الحتة دي في أي app بتبقى critical جدًا، لأنك ساعات محتاج layer كده في النص بين request الـ user والـ response اللي راجع. وهنا ييجي دور الـ Middleware...

———

🔥 يعني إيه Middleware؟

الـ Middleware ببساطة عبارة عن function بتتنفذ قبل ما الـ request يوصل للـ route.

يعني هو واقف كـ حارس البوابة: أي request لازم يعدي منه الأول، وساعتها أنت تقدر:

- تغير في الـ request أو الـ response.
- تعمل redirect أو rewrite.
- تمنع requests معينة.
- أو حتى تضيف logic زي الـ authentication, logging, A/B testing, rate limiting… إلخ.

———

📌 إزاي الـ Middleware بيشتغل في Next.js؟

في Next.js 13 (والـ App Router)، لو عايز تعمل Middleware بتضيف ملف باسم:

middleware.ts or middleware.js

في الـ root بتاع الـ project.

الـ function الأساسية بتكون كده:

import { NextResponse } from 'next/server'
import type { NextRequest } from 'next/server'

export function middleware(req: NextRequest) {
  // Example: check if user is authenticated
  const token = req.cookies.get('token')
  
  if (!token) {
    return NextResponse.redirect(new URL('/login', req.url))
  }

  return NextResponse.next()
}

export const config = {
  matcher: ['/dashboard/:path*'],
}

✅ اللي بيحصل هنا:

- أي request داخل على /dashboard/* لازم يعدي من الـ middleware.
- لو مفيش token: يتعمل redirect على /login.
- لو فيه token: يكمل عادي.

———

⚡️ أهم مميزات الـ Middleware في Next.js:

1- الـ Edge Runtime:
بيتنفذ على الـ Edge (Cloudflare Workers/Akamai… إلخ) يعني ultra fast ومش محتاج server تقيل.

2- الـ Lightweight:
مش معمول إنه يشيل logic تقيل جدًا، هو بس layer سريعة للـ requests.

3- الـ Selective Matching:
تقدر تحدد routes معينة بس اللي تعدي من الـ middleware عن طريق الـ matcher.

4- عنده Use Cases متنوعة:

- Authentication & Authorization.
- Redirects & Rewrites.
- A/B Testing
- Bot Protection.
- Internationalization

———

خلي بالك إن الـ Middleware مش مكان تحط فيه كل الـ business logic بتاعك، هو معمول للحاجات اللي محتاجة تتنفذ بسرعة وقبل ما الـ request يروح للـ route.

يعني authentication, headers, redirects… حاجات كده. لكن الـ heavy logic مكانها مش هنا.

———

وفقكم الله لكل خير 🌿