استضافة Next.js على خادمك مع نشر عند git push

الطريقة المختصرة لاستضافة Next.js على خادمك هي تثبيت لوحة نشر مثل Coolify وربط مستودع GitHub. بعد ذلك يبني كل git push التطبيق وينشر النسخة الجديدة عبر HTTPS. وبحسب توثيق Next.js، تعمل كل الميزات عند النشر بخادم Node.js أو حاوية Docker، فلست مرتبطًا بأي منصة خاصة.

أي الميزات تعمل على خادمك؟

الجدول في التوثيق الرسمي قصير: خادم Node.js وDocker يدعمان كل الميزات، والتصدير الثابت محدود. وعلى خادم واحد يعني ذلك عمليًا ما يلي:

• تعمل مكونات الخادم ومسارات API والاستجابات المتدفقة مع next start.
• لا يحتاج next/image إلى إعداد إضافي، وتُعالَج الصور على الخادم.
• يعمل التخزين المؤقت وإعادة التوليد الثابتة التدريجية (ISR) من تلقاء نفسهما على خادم واحد بقرص دائم. وإذا شغّلت عدة نسخ فعليك مشاركة الذاكرة المؤقتة بينها.
• التوصية الرسمية أن تضع وكيلًا عكسيًا أمام Next.js بدل تعريضه مباشرة. ويأتي Coolify مع Traefik لهذا الغرض، ويحصل Traefik على الشهادة أيضًا.

ما قوة الخادم المطلوبة؟

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

المشروع الصغير هو تطبيق Next.js النموذجي من Coolify. أما الأكبر فتطبيق دردشة بالذكاء الاصطناعي مكتوب بـ Next.js 16 وفيه نحو 85 حزمة، ونفدت ذاكرته على 2 GB أثناء فحص TypeScript. وكان على الخادم 2 GB من swap، والأرقام تعرض أعلى نقطة. وبلغ استخدام القرص بعد أول بناء 13-18 GB. هذه قياساتنا نحن، وسيختلف مشروعك. وإذا فشل البناء لنقص الذاكرة فارفع الحجم أولًا، ثم اخفضه لاحقًا إن استطعت.

خطوة بخطوة

1. اربط المستودع

سجّل الدخول إلى Coolify وافتح مشروعك في صفحة Projects واضغط New resource. وللمستودع العام اختر Public Git Repository وأدخل العنوان واضغط Check repository.

2. أضف مفتاحًا إن كان المستودع خاصًا

من القائمة اليسرى انتقل إلى Private Keys تحت Keys & Tokens وأنشئ مفتاحًا بـ Generate ED25519. وأضف المفتاح العام إلى Deploy keys في صفحة Settings الخاصة بالمستودع على GitHub. ثم استخدم New resource واختر Private Git Repository (with Deploy Key) وأدخل [email protected]:user/project.git. اترك Build pack على Railpack الذي يتعرف على Next.js، ويبقى المنفذ 3000. يصنّف Coolify أداة Railpack على أنها تجريبية (beta)، فإن أزعجتك فاختر Dockerfile الخاص بك.

3. أدخل متغيرات البيئة

في صفحة Environment Variables انتقل إلى Developer view والصق محتوى ملف .env. وثمة تفصيل مهم هنا: المتغيرات التي تبدأ أسماؤها بـ NEXT_PUBLIC_ تُكتب في الشيفرة أثناء البناء. وحين تغيّر أحدها اضغط Redeploy: تلاحظ اللوحة أن إعداد بناء تغيّر فتبني من جديد. ولا تعطِ هذه البادئة لمفتاح لا ينبغي أن يراه المتصفح.

4. اربط نطاقك

أنشئ سجل A لدى مزوّد نطاقك يشير إلى عنوان IP للخادم. وفي Coolify انتقل إلى صفحة Domains واضغط Add domain واختر https بروتوكولًا وأدخل نطاقك واحفظ وانشر من جديد. تُطلب الشهادة وتُجدَّد تلقائيًا. ويجب أن يكون المنفذان 80 و443 مفتوحين.

5. انشر

اضغط Deploy. تعرض صفحة Deployments سجل البناء مباشرة. وحين ينتهي البناء تستمر الحاوية القديمة في الخدمة إلى أن تجهز الجديدة.

كيف يتحول git push إلى نشر؟

مع كل push يرسل GitHub إلى اللوحة طلبًا موقّعًا. تتحقق اللوحة من التوقيع وتعيد بناء التطبيق لذلك الفرع، ويُرفض الطلب ذو التوقيع الخاطئ. وإليك طريقة الإعداد:

1. في صفحة Webhooks الخاصة بالتطبيق، انسخ Webhook URL من قسم GitHub، وأدخل قيمة عشوائية من 16 حرفًا على الأقل في Webhook secret واحفظ.
2. على GitHub افتح Settings الخاصة بالمستودع وانتقل إلى Webhooks واضغط Add webhook.
3. ضع العنوان في Payload URL والقيمة نفسها في Secret. واضبط Content type على application/json واترك push الحدث الوحيد.

للتجربة:

git commit --allow-empty -m "deploy test"

git push

يظهر البناء الجديد في صفحة Deployments. وفي المشروع النموذجي الصغير، بدأ commit جديد العمل خلال 41 ثانية بفضل ذاكرة البناء المؤقتة. يجب أن يستطيع GitHub الوصول إلى عنوان اللوحة، ولما كانت اللوحة مثبّتة بعنوان HTTPS عام فلا حاجة إلى شيء إضافي.

الأخطاء الشائعة

مع خيار Next.js في Seturack يصل Coolify مثبّتًا: الخادم المحلي مفعّل، ومعالج الترحيب منتهٍ، وتُفتح اللوحة عبر HTTPS. يظهر العنوان وكلمة المرور في لوحتك، وتبدأ بربط GitHub. صلاحية root لك، ويمكنك إدارة كل شيء من اللوحة إن فضّلت. النسخ الاحتياطية اليومية مشمولة في السعر والترافيك غير محدود. وتضبط الحجم بالمنزلقات في صفحة Next.js VPS.

جاهز على Seturack: Next.js, Coolify.