دليل المبتدئين إلى GitHub: إضافة الكود إلى حسابك

المصدر: github.blog

📌 موضوع اليوم: سنتحدث عن GitHub Flow وكيفية استخدامه لإضافة الكود إلى حسابنا.

• GitHub Flow هو طريقة لاستخدام GitHub لمشاركة الموارد مع الآخرين والعمل بشكل تعاوني. وليس فقط للكود! يمكنك استخدام هذا الأسلوب للتعاون في أي شيء تقوم بتخزينه داخل المستودع على GitHub.

🔧 تابع لتتعلم كيف تعمل على مشاريعك بسلاسة وكفاءة.

استنساخ مستودع

إضافة الكود إلى مستودعك تبدأ من استنساخ ذلك المستودع. الاستنساخ يعني إنشاء نسخة محلية من المستودع يمكنك استخدامها للعمل. من خلال الحفاظ على تزامن هذه النسخة المحلية مع المستودع البعيد (الموجود على GitHub)، يمكنك الحصول على آخر التحديثات ودفع تغييراتك ليستفيد منها الآخرون أيضًا.

🔹 الخطوة الأولى: انتقل إلى المستودع الذي تريد استنساخه على GitHub — سأقوم أنا باستنساخ هذا المستودع كمثال.

🔹 اضغط على الزر الأخضر الذي يظهر عليه "📄 <> Code". ستظهر نافذة تحتوي على رابط URL لمستودعك، وبجانب الرابط زر "Copy" أسفل تبويب "Local".

🔹 اضغط على زر “Copy” لنسخ الرابط.

✨ والآن، أنت جاهز لاستنساخ المستودع باستخدام Git!

الآن، افتح نافذة الأوامر واكتب git clone مع ترك مسافة إضافية في النهاية. ثم الصق رابط مستودعك واضغط على Enter.

بعد انتهاء الأمر، أدخل المجلد بكتابة cd project ثم اضغط Enter. تأكد من استبدال project باسم مستودعك. بعد الدخول إلى المجلد، ستنتقل إلى الفرع الرئيسي. يمكنك التحقق من فرعك بكتابة git status والضغط على Enter.

إنشاء فرع جديد (Creating a new branch)

أول شيء يجب عليك فعله عند إضافة كود إلى مستودعك هو إنشاء فرع جديد.
هذه خطوة أساسية في GitHub Flow لأنها تحمي الفرع الرئيسي (main) من التغييرات المباشرة.

🔹 عند إنشاء فرع جديد، ستحتاج إلى إعطائه اسمًا.
وبما أنك تنشئ النسخة الأولية من المشروع، يمكنك تسميته version1.

من الأفضل دائمًا استخدام أسماء تصف طبيعة العمل الذي تقوم به داخل الفرع.

افتح سطري الأوامر (Terminal) واكتب الأمر التالي:

git checkout -b version1

ثم اضغط Enter
وهكذا تكون قد أنشأت فرعك الجديد وبدأت العمل فيه! 🚀

تنفيذ التغييرات باستخدام GitHub Desktop

بالإضافة إلى سطر الأوامر (Terminal)، يمكنك أيضًا استخدام GitHub Desktop لإنشاء فروع جديدة وإضافة الكود بسهولة أكبر.

أولًا، قم بتحميل وفتح برنامج GitHub Desktop. تمامًا كما في السابق، أول خطوة هي استنساخ المستودع.

اضغط على الخيار: “Clone a Repository from the Internet…”

الصق رابط المستودع في الخانة المخصصة لذلك. بدلًا من إدخال الرابط الكامل، يمكنك فقط كتابة اسم المستخدم واسم المستودع بهذا الشكل:

<username>/<repo>

ثم اضغط على زر “Clone” وهكذا ستكون قد حصلت على نسخة محلية من المستودع جاهزة للعمل عبر واجهة رسومية أنيقة!

بعد الاتصال بالمستودع، عليك إنشاء فرع جديد. انقر على قسم "الفرع الحالي" في الشريط أعلى النافذة. سيؤدي ذلك إلى فتح نافذة منسدلة تعرض الفروع. انقر على زر "فرع جديد"، ثم سمِّ الفرع الجديد بـ CSS، وانقر على الزر الأزرق "إنشاء فرع".

تنفيذ التغييرات باستخدام سطر الأوامر

بالعودة إلى سطر الأوامر، تأكد من وجودك في مجلد المشروع المناسب، وشغّل الأمر touch index.html script.js لإنشاء ملفات فارغة بهذه الأسماء في مستودعك المحلي. باستخدام محرر الأكواد المفضل لديك، افتح هذه الملفات واكتب أو انسخ الكود الذي تريد رفعه إلى GitHub. بعد الانتهاء، عد إلى الطرفية.

شغّل الأمر git status في الطرفية لعرض قائمة الملفات التي عملت عليها. في هذه المرحلة، يجب أن ترى الملفين اللذين أنشأتهما: index.html وscript.js. أضف هذين الملفين إلى منطقة التجهيز بتشغيل الأمر git add لإضافتهما معًا في الوقت نفسه. يضيف هذا الأمر جميع الملفات غير المتتبعة في مجلد مشروعك. بعد إضافتها، أضف هذه الملفات إلى منطقة التجهيز بتشغيل الأمر git commit -m "created initial project" في الطرفية.

شغّل أمر git status في نافذة الأوامر لعرض قائمة الملفات التي عملت عليها. في هذه المرحلة، يجب أن يظهر الملفان اللذان أنشأتهما: index.html وscript.js. أضف هذين الملفين إلى منطقة التجهيز بتشغيل الأمر git add لإضافتهما معًا. يضيف هذا الأمر جميع الملفات غير المتتبعة في مجلد مشروعك. بعد إضافتها، أضف هذه الملفات إلى منطقة التجهيز بتشغيل الأمر git commit -m "created initial project" في نافذة الأوامر.

فتح طلب سحب

بعد أن تم رفع الكود، استخدم متصفحك لزيارة مستودعك على GitHub. سترى نافذة صغيرة أعلى حسابك تُشير إلى وجود تغييرات حديثة في CSS والإصدار 1. لدمج هذه التغييرات في فرعك الرئيسي، ستحتاج إلى فتح طلب سحب. انقر على الزر الأخضر في مربع الحوار "مقارنة وطلب سحب" لفرع CSS.

أضف عنوانًا يُلخص التغييرات ووصفًا موجزًا ​​يوضح التغييرات التي أجريتها. ثم مرر للأسفل وانقر على الزر الأخضر أسفل الوصف "إنشاء طلب سحب". تهانينا! لقد فتحت للتو طلب السحب الأول! 🎉

الدمج مع الفرع الرئيسي

قد تكون لاحظت أن الفرع الرئيسي الآن يحتوي على تغييرات غير موجودة في فرعك المحلي version1.
وذلك لأن فرع version1 تم إنشاؤه باستخدام نسخة من الفرع الرئيسي قبل رفع تغييرات CSS.
عند فتح طلب السحب (Pull Request)، ربما ظهرت لك رسالة تحذيرية تُشير إلى أن فرعك متأخر عن الفرع الرئيسي.

لكي تتمكن من رفع تغييراتك من version1 إلى main بأمان، عليك أولًا سحب (pull) التغييرات الأخيرة من الفرع الرئيسي إلى فرع version1 المحلي. للقيام بذلك، عد إلى الطرفية (Terminal).

اكتب الأمر التالي:
git switch main ثم اضغط Enter.
بعد ذلك، شغّل الأمر:
git pull
لسحب تغييرات كود CSS التي تمت إضافتها إلى المستودع البعيد.
ثم شغّل الأمر:
git switch version1
للعودة إلى فرعك version1. بعد التبديل، شغّل الأمر:
git merge main
لدمج التغييرات من الفرع الرئيسي إلى الفرع الحالي. بعد تشغيل هذا الأمر، ستظهر لك محرر نصوص يحتوي على رسالة الدمج. اكتب الأمر:
:wq
لحفظ الرسالة والخروج من المحرر.

الآن تحتاج إلى رفع هذه التغييرات، وذلك عبر تنفيذ الأمر التالي:
git push origin version1

---

الخطوات التالية

الآن بعد أن تعلمت كيفية إضافة الكود إلى مستودعاتك، يمكنك البدء بإنشاء مشاريع والتعاون مع مطورين آخرين!

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