قم بإنشاء ونشر التطبيقات على منصة DigitalOcean App بنطاق مخصص

الدروس التعليمية
DNS

مقدمة

كمطورين، نقوم غالبًا ببناء مشاريع جانبية، سواء للمتعة أو لتعلم شيء جديد. تعتبر هذه المشاريع أيضًا دليلاً على مهاراتنا.

يجب أن تمتلك دليل على عملك. بخلاف كودك، يجب على المستخدمين أن يتمكنوا من استخدام تطبيقك، ولذلك، يجب أن لا يكون متاحًا فقط على localhost:3000، بل يمكن الوصول إليه من خلال رابط. لتحقيق ذلك، تحتاج إلى نشر تطبيقك وربطه بنطاق مخصص لقراءة أفضل ومشاركة أسهل.

في هذه المقالة، ستتعرف على منصة تطبيقات DigitalOcean، وسترى مدى سهولة الانتقال من نشر تطبيق إلى ربطه بنطاق مخصص ببضع نقرات فقط.

الشروط الأساسية

  1. حساب DigitalOcean للوصول إلى منصة التطبيقات.

  2. حساب GitHub.

  3. نطاق مخصص متاح على NameCheap أو منصة مماثلة.

ما هي منصة التطبيقات في DigitalOcean؟

منصة التطبيقات هي منصة خدمات مُدارة بالكامل كخدمة (PaaS) تساعد المطورين على بناء ونشر وتوسيع التطبيقات بسهولة. تقوم بتجريد العديد من عمليات إدارة البنية التحتية، مما يتيح لك التركيز على الكود وعملية النشر.

يمكنه تحليل وبناء الشفرة تلقائياً من موفري git مثل GitHub وGitLab، ونشر تطبيقاتك إلى السحابة. يمكنه أيضاً النشر باستخدام صور الحاويات التي قمت برفعها بالفعل إلى سجل DigitalOcean للحاويات أو Docker Hub.

بفضل ميزات مثل التصدي لهجمات DDoS، تحديث نظام التشغيل تلقائياً، توسيع رأسي، دعم HTTP، شبكة توزيع المحتوى العالمية ودعم النطاقات، يجعل منصة التطبيق من السهل نشر وإدارة تطبيقاتك.

الخطوة 1 – النشر باستخدام منصة التطبيق

عندما يكون التطبيق جاهزاً، يمكنك نشره من مستودعات موحدة،صور الحاويات، أو باستخدام إجراءات GitHub.

الـ مستودع الموحد هو مستودع شفرة متحكم بالإصدار يحتوي على العديد من المشاريع. على الرغم من أن هذه المشاريع قد تكون ذات صلة، إلا أنها في كثير من الأحيان مستقلة منطقياً وتُدار بواسطة فرق مختلفة.

لنرى كيف يمكننا نشر التطبيقات باستخدام منصة التطبيقات مع GitHub. لنقول أن لديك مستودع خاص في GitHub يحتوي على ملف index.html الذي يحتوي على هذا الكود البسيط “hello world”:

index.html
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Hello World</title>
</head>
<body>
  <h1>Hello, World!</h1>
  <script>
    console.log("Hello, World!");
  </script>
</body>
</html>

نشر باستخدام GitHub

  • انتقل إلى صفحة التطبيقات وانقر فوق إنشاء تطبيق.

  • قم بربط حسابك على GitHub ثم حدد مستودع GitHub الذي يحتوي على الشفرة المصدرية الخاصة بك.

  • في حقل دليل المصدر، قم بتحديد المجلد الذي يحتوي على الشفرة المصدرية كما هو موضح في الصورة أدناه. نظرًا لأن مستودع العرض التوضيحي يتكون فقط من ملف index.html في المجلد الجذر، سنواصل باستخدام / الافتراضي. إذا كانت شفرتك تتبع هيكل monorepo، تأكد من اختيار المجلد الخاص حيث تقع الشفرة.

حدد تلقائي-النشر، وهذا سيرقي نشرًا تلقائيًا كلما قمت بدفع تغيير جديد:

  • قم بتكوين الموارد الخاصة بتطبيقك وانقر على التالي. هذا ما ستراه:

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

  • في الخطوة التالية، يمكنك تحرير اسم التطبيق واختيار المورد الذي سيتم نشر تطبيقك تحته.

  • ثم تنقر على التالي لعرض الصفحة المراجعة، حيث يمكنك رؤية معلومات التطبيق الأخرى مثل الفواتير، الموقع، إلخ. ثم انقر أخيرًا على إنشاء المورد لنشر التطبيق.

  • سيستغرق ذلك بضع دقائق. بمجرد نشر التطبيق، يمكنك عرض التطبيق على عنوان URL وتفاصيل أخرى في صفحة نظرة عامة.

إذا اتبعت جميع الخطوات أعلاه، هكذا سيبدو تطبيقك: https://sea-lion-app-l8cvv.ondigitalocean.app/.

الخطوة 2: ربط التطبيق بنطاق مخصص

الآن بعد أن تم نشر التطبيق بنجاح ولديه نطاق ondigitalocean.app، في هذه الخطوة، سترى كيف يمكنك ربطه بنطاق مخصص.

هناك طريقتان يمكنك من خلالهما إضافة نطاق مخصص إلى تطبيقك:

  1. استخدام الأتمتة

  2. استخدام لوحة التحكم

في هذه المقالة، ستتعرف على كيفية تكوين النطاق المخصص باستخدام لوحة التحكم.

  • قم بتسجيل الدخول إلى DigitalOcean Cloud وحدد التطبيق الذي تريد إضافة النطاق إليه، ثم انقر فوق علامة التبويب الإعدادات.

  • ثم انقر فوق الرابط تحرير على اليمين من النطاقات، ثم انقر على زر إضافة النطاق.

  • عندما تبدأ في كتابة اسم النطاق الخاص بك في الحقل النصي أدناه، ستحصل على خيارين لإضافة النطاق المخصص الخاص بك.

  • يمكنك إما إضافة النطاق المخصص باستخدام خوادم أسماء DigitalOcean أو باستخدام موفر CNAME.

  • لاستخدام خوادم اسم DigitalOcean، انسخها والصقها (ns1.digitalocean.com، ns2.digitalocean.com، ns3.digitalocean.com) في سجلات خادم الأسماء لدى مسجل النطاق الخاص بك. تحقق من دليلنا حول الإشارة إلى خوادم DigitalOcean Name Servers من مسجلات النطاق الشهيرة للإرشاد حول تفويض نطاقك إلى خوادم اسم DigitalOcean من المسجلات الشهيرة.

  • يمكنك أيضًا إضافة سجل CNAME إلى نطاقك. إذا كانت موفر خدمة DNS الخاص بك ليس DigitalOcean، تحقق من وثائقهم للحصول على التعليمات. استخدم زر نسخ لنسخ الاسم المستعار ondigitalocean.app والصقه في سجل CNAME على موفر خدمة DNS الخاص بك لتوجيه نطاقك المخصص إلى تطبيق منصة التطبيق الخاص بك. بمجرد الانتهاء، انقر على الزر إضافة النطاق.

لمزيد من الإعدادات المتقدمة المتعلقة بالنطاق، راجع الوثائق الخاصة بنا حول كيفية إدارة النطاقات في منصة التطبيق.

إضافة نطاقات تم شراؤها على Namecheap

يمكنك اتباع الخطوات أعلاه لإضافة نطاقات مخصصة تم شراؤها على أي منصة. كمثال، دعنا نرى كيف يمكنك تكوين الإعدادات لنطاق تم شراؤه على Namecheap.

  • قم بتسجيل الدخول إلى حسابك على Namecheap. انقر على قائمة النطاقات، حدد النطاق الذي ترغب في إضافته، ثم انقر على إدارة.

  • ثم انتقل إلى علامة DNS المتقدمة وانقر على إضافة سجل جديد.

  • ثم، اذهب إلى لوحة التحكم في DigitalOcean وانسخ الرابط من الحقل المعروض أدناه.

  • الصقه في Namecheap واحفظ تغييراتك.

هذا كل شيء! الآن، لديك تطبيقك مرتبط بنطاقك المخصص.

الاستنتاج

في هذا المقال، تعلمت كيفية نشر تطبيقاتك وإدارة النطاقات المخصصة باستخدام DigitalOcean.

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

إليك بعض أفضل الممارسات لاتباعها لنطاق مخصص:

  • تأكد من أمان SSL/TLS، حيث يقوم بتشفير البيانات وتحسين تصنيف محركات البحث عن طريق توفير اتصال آمن.

  • راقب صحة النطاق بانتظام لاكتشاف المشاكل والحفاظ على أداء مثالي للمستخدمين.

  • أنشئ نسخ احتياطية لحماية ضد فقدان البيانات والسماح بالاستعادة السريعة إذا ما واجه نطاقك أو موقعك مشاكل.

الخطوات التالية

إذا قررت إيقاف تطبيقك لأي سبب، تأكد من إزالة النطاق المخصص قبل حذف التطبيق. لإزالته، انتقل إلى لوحة التحكم، انقر على التطبيق الخاص بك، ثم انقر على الإعدادات. بعد ذلك، انقر على الرابط تحرير على اليمين من النطاقات وعلى عنصر القائمة المتكون من ثلاث نقاط (…)، وأخيرًا، انقر على إزالة النطاق لإزالة النطاق.

ها هي قائمة الموارد التي يمكن أن تكون مفيدة:

Source:
https://www.digitalocean.com/community/tutorials/deploy-apps-with-custom-domain