NahdaAIنهضة
Git & GitHub • المستوى الرابع • الدرس 1

الأوتوماتيكية والتكامل المستمر (GitHub Actions & CI/CD)

العودة لفهرس المستوى

أهداف الدرس

  • فهم مفاهيم التكامل المستمر (CI) والنشر المستمر (CD).
  • إعداد ملفات YAML داخل مجلد .github/workflows.
  • تفعيل التخزين المؤقت (Cache) لتسريع البناء عبر actions/setup-node.
  • استخدام workflow_dispatch للسماح بالتشغيل اليدوي للـ workflow.

1. ما هي خدمة GitHub Actions؟

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

yaml
# ملف .github/workflows/ci.yml
name: CI Pipeline

on:
  push:
    branches: [ main ]
  pull_request:
    branches: [ main ]
  workflow_dispatch:      # تشغيل يدوي

jobs:
  build:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      - name: Install
        run: npm ci
      - name: Test
        run: npm test

2. تشريح ملف Workflow

name

اسم الـ Workflow — يظهر في تبويب Actions على GitHub.

on

الأحداث المُشغّلة: push, pull_request, workflow_dispatch.

jobs

مجموعة المهام المتوازية، كل مهمة تعمل على runs-on محدد.

steps

قائمة الخطوات المتسلسلة. كل خطوة إما uses (إجراء جاهز) أو run (أمر shell).

3. مزايا متقدمة في GitHub Actions

Cache

تخزين node_modules مؤقتاً لتسريع البناء.

Manual Trigger

عبر workflow_dispatch من واجهة GitHub.

Env Vars

متغيرات بيئة عامة أو خاصة بكل خطوة.

التطبيق العملي المباشر

تحدي الدرس الأول: تطوير ملف CI Workflow

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

  1. أضف workflow_dispatch: تحت قسم on: للسماح بالتشغيل اليدوي.
  2. أضف قسم env: عام يحتوي على NODE_ENV: test.
  3. أضف cache: 'npm' تحت with: في خطوة إعداد Node.js.
  4. أضف خطوة جديدة بعنوان Run Linter تُنفّذ npm run lint.
  5. أضف خطوة أخيرة بعنوان Build Project تُنفّذ npm run build.
⏳ جارٍ تحميل المحرر التفاعلي...
فهرس المستوىالانتقال للمشروع النهائي