استخدام Surge لنشر المواقع الثابتة: دليل شامل

عند نشر مواقع الويب الثابتة ، يبحث مطورو تطبيقات الويب دائمًا عن أحدث الأدوات وأكثرها فعالية لتحسين مواقعهم على الويب. بشكل عام ، يتحسن مولد الموقع الثابت (SSG) بالعمليات المشفرة يدويًا ونظام إدارة المحتوى الكامل. يعد هذا الإعداد مثاليًا لمعظم مواقع الويب أو مشاريع تطبيقات الويب ، وليس معالجتها من جانب الخادم. نظرًا لهذا الاتجاه ، ينتقل المطورون إلى برنامج webtask.io للتعامل مع نقاط نهاية الخادم المختلفة الخاصة بهم. إلى جانب الاتجاه الكبير لتطوير تطبيقات الويب ، توضح هذه المقالة بالتفصيل العمليات التي يخضع لها مطورو البرامج لنمو مواقعهم الثابتة و serverless تطبيقات الويب.

ما هي مولدات الموقع الثابت؟

بالتفصيل ، يقوم المطورون الذين يستخدمون State Site Generators ببدء العملية عن طريق إنشاء موقع ويب HTML فقط. نظرًا لكونه HTML فقط ، فإن الموقع يعمل في الغالب على البيانات الأولية والقوالب. كما ذكرنا سابقًا ، تُصنف البيانات الأولية أيضًا على أنها "ملفات تخفيض السعر". لفهم أفضل ، تعد ملفات markdown (الرابط: https://guides.github.com/features/mastering-markdown/) ملفات نصية عامة تستخدم لهجات لغة markdown. يحتوي تنسيق النص العادي على رموز نصية لإنشاء تنسيقات مع نصوص بما في ذلك الخط الغامق والمائل والمسافة البادئة والعناوين وشاشات العرض.

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

المواقع الثابتة مقابل المواقع الديناميكية

بالمقارنة، مواقع ثابتة تعتمد على HTML و CSS من جانب العميل. عندما يطلب العميل من موقع ويب خادم ثابت ، يتم تجميع ملفات HTML بدقة في موقع يمكن عرضه على الفور على أجهزة الضيف. تتضمن بعض مولدات المواقع الثابتة الشائعة جيكل، والتي تدعمها صفحات Github ، و التالى. في المقابل ، تعتمد مواقع الويب الديناميكية على لغات البرمجة النصية من جانب العميل والخادم. بالنسبة لبعض الأمثلة ، JavaScript (الرابط: https://www.javascript.com) ، PHP (الرابط: https: //www.php.net) ، و ASP (الرابط: https: //www.w3schools.com/ asp / webpages_intro.asp) عبارة عن نصوص "ديناميكية من جانب الخادم". للتوضيح ، فإن التشغيل باستخدام خادم HTTP ديناميكي يرسل الملفات إلى المتصفح. في الوقت نفسه ، يُنشئ المُنشئ ملف HTML جديدًا في كل مرة يتصل فيها المستخدم بصفحة.

ما هي الطفرة؟

Surge هي خدمة لنشر واستضافة المواقع والتطبيقات الثابتة. يمكنك استخدامه لاستضافة المشاريع التي تم إنشاؤها باستخدام مولدات المواقع الثابتة مثل غاتسبي.js, جيكل. سيعمل أيضًا أي مشروع مخصص تم إنشاؤه باستخدام HTML و CSS وجافا سكريبت من جانب العميل. تعد خطتها المجانية مثالية لأي موقع ثابت تقريبًا ، ويمكن تكوين الخدمة فقط ببضع ضغطات على سطر الأوامر. يتوفر إصدار متميز يضيف بعض الميزات الإضافية مثل SSL المخصص وحماية كلمة المرور والمزيد.

لماذا يجب علي استخدام Surge؟

Surge هي أداة مريحة للغاية يجب على أي مطور ويب أمامي استخدامها. إنه أمر بسيط للغاية ، ويمكنك نشر موقع ثابت عبر الإنترنت في غضون ثوانٍ. كل ما يتطلبه النشر على الويب هو بضعة أوامر في سطر الأوامر ، وأفضل جزء هو أنه لا يوجد استثمار مطلوب. أيضًا ، يمكن للمستخدمين إضافة مجالات شخصية إلى مشاريعهم ، ومشاركة المشاريع مع مستخدمين آخرين ، وإنشاء صفحات خطأ 404 لتوجيه العملاء إلى صفحات الويب الأخرى. تتمتع Surge ببعض المزايا الفريدة التي يفتقر إليها ناشرو المواقع الثابتة المشهورة الأخرى (راجع "مقارنة بين Surge وصفحات Github").

هل Surge خدمة مجانية؟

كما هو موضح أعلاه ، لا يتطلب Surge أي تكلفة للاستخدام. ومع ذلك ، هناك Surge Professional الذي يأتي بمزايا أكثر للمستخدمين الراغبين في استثمار الرسوم الإضافية. يبدأ هذا الإصدار المتميز من الخدمة بسعر 30 دولارًا شهريًا. على وجه التحديد ، مع الرسوم الإضافية ، يمكنك إنشاء مشاريع احترافية غير محدودة ، والحصول على SSL مخصص ، والحصول على موقع ويب آمن باستخدام HTTPS. يمكنك أيضًا مشاركة الموارد وتطوير عمليات إعادة التوجيه داخل موقعك وحماية مشاريعك بكلمات مرور.

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

تركيب Surge

يعد تثبيت Surge وإعداد حساب أمرًا بسيطًا للغاية وبديهيًا. افتح نافذة طرفية جديدة واكتب الأمر التالي:

تثبيت npm - Global Surge

(ملاحظة: تفترض هذه الخطوة أن Node و npm قد تم تثبيتهما بالفعل على نظامك. إذا لم يكن الأمر كذلك ، فيمكنك تثبيت أحدث إصدار لكليهما من المسؤول موقع Node.js.)

للتحقق مما إذا كان Node.js.website مثبتًا بشكل صحيح ، توجه إلى سطر الأوامر وأدخل "node -v" للحصول على الحالة.

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

نشر موقعك

لاستخدام موقع الويب الثابت الخاص بك في Surge ، ابحث أولاً عن مسار ملف دليل المشروع الذي تريد تنفيذه. على سبيل المثال ، سأقوم بتنفيذ مشروع يقع في / Users / air / Surge-test.

بمجرد معرفة مسار ملف الدليل المراد نشره ، قم بتشغيل الأمر التالي في نافذة طرفية:

موجة

سيتم عرض اسم المستخدم الخاص بك (على سبيل المثال ، عنوان البريد الإلكتروني). بعد ذلك ، ستحتاج إلى توفير مسار الملف للمشروع:

أدخل مسار الملف الكامل ، ثم اضغط على Enter.

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

(ملاحظة: سترى رسالة خطأ إذا كان اسم المجال المخصص الذي أدخلته مستخدمًا بالفعل.
تم إحباط - لا يمكنك النشر على [ ]

بمجرد اكتمال النشر ، سترى رسالة نجاح معروضة في جهازك. سيُظهر لك اسم مجال المشروع وعنوان IP حيث يمكنك الوصول إلى النشر المباشر.

أدخل اسم المجال في متصفح الويب الخاص بك ، وسترى الآن موقعك على الهواء مباشرة:

إضافة اسم مجال مخصص

باستخدام سجل CNAME

بشكل افتراضي ، ستوفر Surge نطاقًا فرعيًا مخصصًا لأي موقع ويب تنشره في خدمتهم. سيبدو مثل your-custom-domain.surge.sh. يمكنك تخصيص النطاق الفرعي وتحديده (بشرط ألا يكون قد تم استخدامه بالفعل). سترغب في استخدام المجال المخصص الخاص بك لأي مشروع احترافي.

للقيام بذلك ، ستحتاج إلى إضافة سجلي CNAME جديدين في لوحة DNS لمزود المجال الخاص بك. سيكون أحدهما باسم مضيف @ ، والآخر سيكون باسم مضيف www. سيشير كلا سجلي CNAME إلى عنوان IP التالي:

na-west1.surge.sh

باستخدام سجل A.

إذا كان موفر النطاق الخاص بك ، لسبب ما ، لا يسمح بسجلات CNAME ، فيمكنك تعيين سجل A كبديل. اجعل سجل A يشير إلى عنوان IP وهو 45.55.110.124.

استخدام النطاقات الفرعية المخصصة

يمكنك أيضًا استخدام أي مجال فرعي مخصص للإشارة إلى Surge ، مثل sub.my-cool-site.com. ستحتاج إلى إعداد سجل CNAME جديد للقيام بذلك. يجب أن يؤدي هذا إلى نفس عنوان IP الخاص بـ na-west1.surge.sh أعلاه ، ولكن هذه المرة سيكون اسم المضيف *. * اسم المضيف هو حرف بدل. سيكون أي مجال فرعي بخلاف النطاق الأساسي صالحًا ومسموحًا به.

سيتعرف برنامج الزيادة على تغييرات DNS هذه على الفور. قد يستغرق الانتشار في مكان آخر وقتًا ؛ ومع ذلك ، لا يستغرق الأمر عادةً أكثر من 24-48 ساعة.

نشر المشاريع باستخدام المجالات المخصصة

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

مسار ملف الزيادة / من / المشروع a-cool-custom-domain.com

ربط المجالات المخصصة بالمشاريع

يمكنك ربط المجال الخاص بك بالمشروع ، حتى لا تضطر إلى إدخاله عند النشر. يمكنك القيام بذلك باستخدام الأمر echo ، وتوجيهه إلى ملف CNAME ، مثل:

صدى a-cool-custom-domain.com> CNAME

مشاركة مشروع Surge الخاص بك

لمنح إذن نشر لمستخدمي Surge الآخرين ، يجب عليك أولاً نشر مشروعك. ثم اكتب الأمر add في سطر الأوامر لإضافة المتعاونين من خلال عناوين بريدهم الإلكتروني.

زيادة - إضافة تعاونemail.com

يمكن للضيوف الذين تمت دعوتهم إلى مشروعك ويقبلون دعوتك الآن نشر ملفاتهم المصدر في نفس المجال.

قائمة مشاريع الزيادة

لعرض المشاريع التي نشرتها باستخدام Surge ، اكتب أمر Surge البسيط هذا في سطر الأوامر. سيؤدي هذا إلى إنشاء قائمة بجميع مشاريعك.

قائمة الطفرة

إضافة صفحات خطأ 404 مخصصة

إذا كنت تفضل استبدال صفحة الخطأ 404 الافتراضية بأخرى مصممة خصيصًا ، فكل ما عليك فعله هو إضافة ملف 404.html إلى مشروع Surge عندما تكون جاهزًا لنشر ملفات 404 الجديدة ، ما عليك سوى زيادة الأمر.

قم بإنشاء ملف .surgeignore

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

لإعداد هذا ، قم بإنشاء ملف جديد يسمى .surgeignore في جذر مجلد المشروع الخاص بك. يمكنك سرد أي ملفات وأدلة تريد تجاهلها في هذا الملف. تتضمن بعض الأمثلة الشائعة node_modules و bower_components وغيرها. يمكنك أيضًا تجاهل أنواع ملفات معينة ليست ذات صلة بإصدار إنتاج الموقع. ستؤدي إضافة * (رمز حرف البدل) قبل الامتداد (مثل * .swp ، * .psd ، إلخ) إلى تحقيق ذلك.

إزالة الموقع من Surge

إذا كنت ترغب ، لسبب ما ، في إزالة موقع الويب الخاص بك ، فيمكنك القيام بذلك بسهولة باستخدام أمر التمزيق المفاجئ ، متبوعًا بمجال مشروعك.

تصاعد هدم your-domain.com

قبل محاولة إزالة مشروعك ، تأكد من تحديث إصدار Surge إلى أحدث إصدار.

مقارنة بين صفحات Surge و Github

على غرار Surge ، هناك خدمة استضافة ثابتة بديلة شائعة أخرى هي صفحات جيثب. تتيح هذه الخدمة المجانية للمستخدمين استضافة مشروعاتهم الشخصية الثابتة في مستودع جيثب. تفتخر Github Pages بسمعة معروفة للغاية بين مطوري الويب من أي عيار كواحدة من أعلى خدمات الاستضافة الثابتة مرتبة. يمكن إنشاء نوعين من الصفحات ، "صفحات المشروع أو صفحات المستخدم والمؤسسة" ، والتي يمكن إنشاؤها ضمن المجال github.io. بالطبع ، لديك الحرية في استخدام مجال مخصص أيضًا. توصي Github صراحةً بعدم نشر أي مشاريع مخصصة للأغراض التجارية باستخدام خدمة الاستضافة الخاصة بهم. لذلك ، في حين أنه قد لا يكون قادرًا على استيعاب مواقع الويب واسعة النطاق ، فإن صفحات Github مثالية للاستخدامات غير التجارية أو الشخصية.

توجد اختلافات طفيفة بين صفحات المشروع وصفحات المستخدم والمؤسسة. يمكن نشر صفحات المشروع من مواقع مصادر متعددة ، بما في ذلك الفروع الرئيسية و "صفحات GH". بدون مجال مخصص ، سيكون مجال النشر الافتراضي هو https: // .github.io /. من ناحية أخرى ، توجد صفحات المستخدم والمؤسسة في الفرع الرئيسي أسفل مستودع Github الخاص بك. لقد نشروا مع المجال https: // .github.io.

فوائد الطفرة

في حين أن Github Pages بلا شك أداة قوية ، تقدم Surge بعض الفوائد التي تفتقر إليها صفحات Github. إحدى هذه الفوائد هي التوجيه من جانب العميل. ضمن مشروع Surge الخاص بك ، يمكنك إعادة توجيه العملاء إلى ملف HTML "احتياطي" (200.html) إذا طلبوا مسارًا غير موجود. هذا مفيد لأن Surge سيخدم الملف الاحتياطي بدلاً من عرض خطأ 404 ينذر بالخطر.

فائدة أخرى ملحوظة لـ Surge هي أنه يمكن للمستخدمين نشر أي تغييرات جديدة على مواقعهم في ثوانٍ. كما هو مذكور أعلاه ، ببساطة عن طريق كتابة أمر الزيادة في سطر الأوامر ، يمكن عرض أي تغييرات قمت بإجرائها على الفور عبر الإنترنت. من المفيد بشكل خاص أثناء الاختبار التجريبي ، من السهل إدارة التعديلات البسيطة على مواقع الويب الخاصة بالمستخدمين. نظرًا لخيار التحديث الفوري لصفحة الويب ، فإن رؤية التغييرات في متصفح الويب تكون أكثر وضوحًا. بدلاً من ذلك ، سيستمر مستخدمو Github Page في دفع التغييرات وتنفيذها على واجهاتهم عبر الإنترنت والمعاناة مع عمليات أطول وأكثر شاقة. على المدى الطويل ، يمنع الموقع الثابت الصحيح الوقت المربك لمطوري البرامج.

وفي الختام

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

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

بشكل عام ، فإن Surge يستحق النظر إذا كنت تبحث عن طريقة موثوقة وفعالة لنشر موقعك الثابت. من خلال واجهته البديهية وميزاته القوية ووثائقه المفيدة ، تعد Surge أداة قيمة لأي مطور يتطلع إلى نقل موقع الويب الخاص به إلى المستوى التالي. فلماذا لا تجربها وترى كيف يمكن أن تساعدك على تبسيط عملية التطوير الخاصة بك ونقل موقعك إلى المستوى التالي؟