Git & GitHub • المستوى الرابع • الدرس 2

المشروع النهائي — أمان المستودع والنشر التلقائي على GitHub Pages

أهداف المشروع الشامل

حماية الفروع الأساسية بـ Branch Protection Rules لمنع التعديل المباشر.
إدارة المفاتيح الحساسة بـ Repository Secrets بدل كتابتها في الكود.
نشر موقعك مجاناً على GitHub Pages بأتمتة كاملة عبر Actions.
تقسيم الـ Workflow إلى مرحلتين: build ← deploy مع نقل الـ Artifacts.

1. حماية الفروع (Branch Protection Rules)

تمنع أي عضو من رفع تغييرات مباشرة إلى فرع الإنتاج قبل نجاح الفحوصات التلقائية وموافقة المشرفين.

bash

# إعدادات حماية فرع main على GitHub
# Settings -> Branches -> Add branch protection rule

Require a pull request before merging
  - Require approvals: 2
  - Dismiss stale pull request approvals when new commits are pushed

Require status checks to pass before merging
  - Require branches to be up to date before merging

Require conversation resolution before merging
Do not allow bypassing the above settings

2. المفاتيح السرية (Repository Secrets)

بدلاً من كتابة المفاتيح مباشرة في الكود (خطر أمني!)، تُخزَّن في Repository Secrets وتُستدعى في الـ Workflow بـ ${{ secrets.NAME }}.

طريقة خاطئة

run: curl -H "Auth: sk_live_abc123" ...

المفتاح ظاهر في الـ logs! خطر تسريب.

طريقة صحيحة

run: curl -H "Auth: ${{ secrets.API_KEY }}" ...

المفتاح محفوظ ومشفر في GitHub.

3. GitHub Pages — استضافة مجانية

1. التفعيل

Settings → Pages → Source: GitHub Actions

2. النشر التلقائي

كل Push على main يُشغّل النشر.

3. الرابط

username.github.io/repo

التطبيق العملي المباشر — التحدي الختامي

تحدي إتمام مسار Git & GitHub: النشر التلقائي الكامل

قم بالتعديل على ملف deploy.yml بداخل المحرر أدناه لتطبيق المتطلبات التالية:

أضف workflow_dispatch: تحت on: للسماح بالتشغيل اليدوي.
أضف قسم concurrency: بمجموعة "pages" لمنع النشر المتوازي.
أضف cache: 'npm' في إعداد Node.js.
أضف خطوة جديدة Run Tests تُنفّذ npm test بين التثبيت والبناء.
أضف خطوة Upload Artifact تستخدم actions/upload-pages-artifact@v3 مع path: './dist'.
أنشئ Job ثانياً باسم deploy يعتمد على build عبر needs: build، ويستخدم actions/deploy-pages@v4.

⏳ جارٍ تحميل المحرر التفاعلي...

الدرس السابق إتمام مسار Git & GitHub بالكامل