أساسيات Git و GitHub — نشر المواقع والدومينات

أساسيات Git و GitHub

كل منصات النشر الحديثة (GitHub Pages، Netlify، Vercel، Render) تنشر موقعك مباشرة من مستودع Git: ترفع تعديلاً ← يُبنى الموقع ويُنشر تلقائياً. لذلك Git هو الخطوة الأولى.

- Git: برنامج على جهازك يحفظ تاريخ مشروعك (لقطات متتالية).

- GitHub: موقع يستضيف نسخة من مستودعك على الإنترنت للمشاركة والنسخ الاحتياطي والنشر.

المناطق الثلاث

مجلد العمل  ──git add──▶  منطقة التجهيز  ──git commit──▶  المستودع المحلي  ──git push──▶  GitHub
(تعديلاتك)               (ما سيدخل اللقطة)               (التاريخ)

إعداد لمرة واحدة

git config --global user.name "اسمك"
git config --global user.email "you@example.com"

بداية مشروع وأول رفع

cd my-site
git init
git status                 # ما الذي تغيّر؟ (استخدمه كثيراً)
git add .
git commit -m "الصفحة الرئيسية الأولى"
git branch -M main
git remote add origin https://github.com/USERNAME/my-site.git
git push -u origin main

بعدها، العمل اليومي ثلاثة أوامر: git add . ثم git commit -m "..." ثم git push.

رسائل commit جيدة

صِف ماذا ولماذا باختصار: "إضافة نموذج التواصل" أو "إصلاح القائمة على الجوال". تجنب "تعديلات" و "aaa" — ستحتاج هذا التاريخ عندما تبحث عن متى ظهر خطأ.

ملف .gitignore: ما لا يُرفع أبداً

ملف نصي في جذر المشروع يسرد ما يتجاهله Git:

node_modules/
dist/
.env
.env.local
.DS_Store
*.log

- node_modules/: ضخم ويُعاد تثبيته بـ npm install.

- dist/: ناتج البناء؛ المنصة تبنيه بنفسها.

- .env: الأسرار (مفاتيح API، كلمات مرور قواعد البيانات).

⚠️ القاعدة الذهبية: لا أسرار في Git

GitHub تُفحص باستمرار بواسطة برامج آلية تبحث عن مفاتيح مسرّبة، وتستغلها خلال دقائق من رفعها.

- إن رفعت مفتاحاً بالخطأ، حذفه في commit جديد لا يكفي: يبقى في التاريخ. الحل الوحيد الآمن: ألغِ المفتاح فوراً من لوحة الخدمة وأنشئ مفتاحاً جديداً، ثم أزل الملف من التتبع (git rm --cached .env) وأضفه إلى .gitignore.

- المستودعات الخاصة ليست مكاناً آمناً للأسرار أيضاً.

- الطريقة الصحيحة لتمرير الأسرار: متغيرات البيئة (الدرس بعد التالي).

الفروع باختصار

git switch -c feature/contact-form   # فرع جديد لتجربة ميزة
# ... تعديلات و commits ...
git switch main
git merge feature/contact-form

منصات مثل Netlify و Vercel تنشئ رابط معاينة لكل فرع أو Pull Request، فتجرّب التعديل على رابط حقيقي قبل دمجه في الموقع الرئيسي.

أوامر مفيدة أخرى

| الأمر | الفائدة |

|---|---|

| git log --oneline | التاريخ مختصراً |

| git diff | ما الذي تغيّر بالضبط قبل الإضافة |

| git restore file.html | التراجع عن تعديلات ملف لم تُضف بعد |

| git pull | جلب تحديثات GitHub (عند العمل من أكثر من جهاز) |

| git clone URL | نسخ مستودع موجود |

تمرين

أنشئ مستودعاً لصفحتك الشخصية من دورة HTML/CSS: أضف .gitignore، وارفعه إلى GitHub بثلاثة commits على الأقل برسائل واضحة. ثم أنشئ ملف .env فيه قيمة تجريبية وتأكد بـ git status أنه لا يظهر.

# ===== إنشاء مشروع جديد =====

# 1. افتح المجلد في Terminal
cd my-project

# 2. ابدأ Git
git init

# 3. أضف كل الملفات
git add .

# 4. أول commit
git commit -m "Initial commit - بداية المشروع"

# 5. أنشئ Repository على GitHub
# اذهب لـ github.com → New Repository

# 6. اربط المشروع
git remote add origin https://github.com/username/my-project.git

# 7. ارفع الكود
git push -u origin main


# ===== العمل اليومي =====

# بعد تعديل الملفات
git add .
git commit -m "أضفت صفحة التواصل"
git push

# رؤية حالة الملفات
git status

# رؤية التاريخ
git log --oneline


# ===== ملف .gitignore =====
# أنشئ ملف .gitignore لتجاهل ملفات معينة

# محتوى .gitignore:
node_modules/
.env
.DS_Store
*.log
dist/