كيفية إنشاء موقع ثابت على مواقع عمال Cloudflare

مرحبًا! اسمي ديما، أنا قائد فني لفريق SysOps في Wrike. سأخبرك في هذه المقالة بكيفية إنشاء موقع ويب قريب من المستخدم قدر الإمكان في 10 دقائق و5 دولارات شهريًا وأتمتة نشره. لا علاقة للمقال تقريبًا بالمشكلات التي نحلها داخل فريقنا. هذه بالأحرى تجربتي الشخصية وانطباعاتي في التعرف على تكنولوجيا جديدة بالنسبة لي. حاولت وصف الخطوات بأكبر قدر ممكن من التفاصيل حتى تكون التعليمات مفيدة للأشخاص ذوي الخبرة المختلفة. ط نتمنى أن تستمتعوا. يذهب!

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

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

نحن نستخدم Gitlab CI/CD للتشغيل الآلي، ولكن ماذا عن التسريع؟ دعونا ننشر الموقع مباشرة على Cloudflare باستخدام مواقع العمال.

ما هو المطلوب للبدء:

• Gitlab (الخاص بك أو غائم)

• حساب على كلاودفلير

• المثبتة Nodejs/npm

الجزء 1: تثبيت هوغو

إذا كان لديك Hugo مثبتًا بالفعل، أو إذا كنت تفضل مولد موقع ثابت مختلفًا (أو لا تستخدم واحدًا على الإطلاق)، فيمكنك تخطي هذا الجزء.

1. تحميل هوغو من https://github.com/gohugoio/hugo/releases

2. نضع ملف Hugo القابل للتنفيذ وفقًا لأحد الملفات المحددة في PATH طرق

3. إنشاء موقع جديد: hugo new site blog.example.com

4. قم بتغيير الدليل الحالي إلى الدليل الذي تم إنشاؤه حديثًا: cd blog.example.com

5. حدد موضوع التصميم (https://github.com/budparr/gohugo-theme-ananke/releases أو أيا كان)

6. لنقم بإنشاء المشاركة الأولى: hugo new posts/my-amazing-post.md

7. إضافة محتوى إلى الملف الذي تم إنشاؤه: content/posts/my-amazing-post.md.
   عند الانتهاء من كل شيء، قم بتغيير قيمة المسودة إلى زائف

8. توليد ملفات ثابتة: hugo -D

الآن يقع موقعنا الثابت داخل الدليل ./عام وجاهز للنشر اليدوي الأول.

الجزء 2: إعداد Cloudflare

الآن دعونا نلقي نظرة على الإعداد الأولي لـ Cloudflare. لنفترض أن لدينا بالفعل نطاقًا للموقع. لنأخذ كمثال blog.example.com.

الخطوة 1: إنشاء إدخال DNS

أولا، حدد المجال الخاص بنا، ثم عنصر القائمة DNS. نقوم بإنشاء مدونة A-record ونشير إلى بعض عناوين IP الوهمية لها (هذا هو الملف الرسمي توصية، لكن كان بإمكانهم جعلها أجمل قليلاً).

الخطوة 2: رمز Cloudflare

1. ملفي الشخصي -> رموز API علامة التبويب-> قم بإنشاء رمز -> إنشاء رمز مخصص

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

احفظ الرمز للمستقبل، سنحتاجه في الجزء الثالث.

الخطوة 3: الحصول على accountid وzoneid

نطاق → نظرة عامة → [الشريط الجانبي الأيمن]

هذه ملكي، لا تستخدمها من فضلك :)

احفظهم بجوار الرمز، سنحتاجهم أيضًا في الجزء الثالث.

الخطوة 4: تفعيل العمال

نطاق → العمال → إدارة العمال

نختار اسمًا فريدًا وتعريفة العمال → غير محدود (5 دولارات شهريًا اليوم). إذا كنت ترغب في ذلك، يمكنك الترقية لاحقًا إلى الإصدار المجاني.

الجزء 3: النشر الأول (النشر اليدوي)

لقد قمت بأول عملية نشر يدوية لمعرفة ما يحدث بالفعل هناك. على الرغم من أن كل هذا يمكن القيام به بشكل أسهل:

1. تثبيت رانجلر: npm i @cloudflare/wrangler -g

2. دعنا نذهب إلى دليل مدونتنا: cd blog.example.com

3. إطلاق رانجلر: wrangler init — site hugo-worker

4. قم بإنشاء تكوين لـ wrangler (أدخل الرمز المميز عند سؤالك): wrangler config

الآن دعونا نحاول إجراء تغييرات على الملف الذي تم إنشاؤه حديثًا رانجلر (هنا القائمة الكاملة للإعدادات الممكنة):

1. حدد accountid وzoneid

2. نحن نتغير الطريق إلى شيء مثل *blog.example.com/*

3. حدد زائف إلى com.workersdev

4. قم بتغيير الدلو إلى ./public (أو حيث يقع موقعك الثابت)

5. إذا كان لديك أكثر من مجال واحد في المسار، فيجب عليك تصحيح المسار في البرنامج النصي العامل: موقع العمال/index.js (انظر الوظيفة HandleEvent)

رائع، لقد حان الوقت لنشر الموقع باستخدام الفريق wrangler publish.

الجزء 4: أتمتة النشر

تمت كتابة هذا الدليل خصيصًا لـ Gitlab، لكنه يجسد جوهر النشر الآلي وسهولة النشر بشكل عام.

الخطوة 1: إنشاء وتكوين مشروعنا

1. قم بإنشاء مشروع GitLab جديد وقم بتحميل الموقع: الدليل blog.example.com مع كافة المحتويات يجب أن تكون موجودة في الدليل الجذر للمشروع

2. وضعنا عامل كفابيتوكين هنا: الإعدادات → CI / CD → المتغيرات

الخطوة 2: قم بإنشاء ملف .gitlab-ci.yml وقم بتشغيل النشر الأول

قم بإنشاء ملف .gitlab-ci.yml في الجذر بالمحتوى التالي:

stages:
  - build
  - deploy

build:
  image: monachus/hugo
  stage: build
  variables:
    GIT_SUBMODULE_STRATEGY: recursive
  script:
    - cd blog.example.com/
    - hugo
  artifacts:
    paths:
      - blog.example.com/public
  only:
    - master # this job will affect only the 'master' branch
  tags:
    - gitlab-org-docker #


deploy:
  image: timbru31/ruby-node:2.3
  stage: deploy
  script:
    - wget https://github.com/cloudflare/wrangler/releases/download/v1.8.4/wrangler-v1.8.4-x86_64-unknown-linux-musl.tar.gz
    - tar xvzf wrangler-v1.8.4-x86_64-unknown-linux-musl.tar.gz
    - cd blog.example.com/
    - ../dist/wrangler publish
  artifacts:
    paths:
      - blog.example.com/public
  only:
    - master # this job will affect only the 'master' branch
  tags:
    - gitlab-org-docker #

نطلق عملية النشر الأولى يدويًا (CI / قرص مضغوط → خطوط الأنابيب → تشغيل خط الأنابيب) أو عن طريق الالتزام بالفرع الرئيسي. هاهو!

اختتام

حسنًا، ربما قللتُ من أهمية الأمر قليلًا، واستغرقت العملية برمتها ما يزيد قليلاً عن عشر دقائق. ولكن لديك الآن موقع سريع يتميز بالنشر التلقائي وبعض الأفكار الجديدة حول ما يمكنك فعله باستخدام العمال.

 عمال Cloudflare    هوغو    جيتلاب سي

المصدر: www.habr.com