في الدرس الأخير (لغة JavaScript)، وصلنا إلى لحظة فارقة: مشروعنا لم يعد مجرد صفحات ثابتة، بل أصبح كيانًا ديناميكيًا يتفاعل مع المستخدم.

لقد أصبح له قيمة حقيقية، ومع هذه القيمة، تظهر مجموعة جديدة من الأسئلة الاحترافية.

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

هنا يتوقف دور الحرفي ليبدأ دور المهندس. المهندس المحترف لا يبني عشوائيًا؛ بل يعتمد على مخططات دقيقة وسجل عمل منظم.

في عالم تطوير الويب، أدواتنا الهندسية لهذه المهمة هي Git و GitHub.

في هذا المقال، سنقوم بتركيب "نظام المخططات" لمشروعنا باستخدام Git، لنسجل كل خطوة في بنائه. ثم، سنقوم برفع هذه المخططات إلى "خزنتنا السحابية الآمنة" على GitHub، لنحمي عملنا ونهيئه للمستقبل.

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

ما هو Git؟ آلة الزمن لمشروعك

ببساطة، Git هو نظام تحكم بالإصدارات (Version Control System).

فكر فيه كـ "صندوق أسود" أو "سجل عمل" دقيق لكل ملف في مشروعك. على عكس طريقة الحفظ التقليدية التي تحتفظ فقط بالنسخة الأخيرة من الملف، يقوم Git بحفظ لقطة (snapshot) كاملة لمشروعك في كل مرة تطلب منه ذلك.

كل لقطة هي إصدار كامل يمكنك العودة إليه في أي وقت. إنه بمثابة آلة زمن تسمح لك بالتنقل بحرية عبر تاريخ تطور مشروعك.

لكن ما يجعل Git ثوريًا هو أنه نظام موزع (Distributed).

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

أما في Git، فالأمر مختلف تمامًا. عندما تعمل على مشروع، فإن حاسوبك المحلي يحتوي على نسخة كاملة ومستقلة من تاريخ المشروع بأكمله.

يمكنك حفظ الإصدارات، إنشاء فروع، ومراجعة التاريخ، كل ذلك دون الحاجة لاتصال بالإنترنت. كل مطور في الفريق يمتلك آلة زمن خاصة به، ويمكنهم لاحقًا مزامنة "الخطوط الزمنية" الخاصة بهم معًا.

إذًا، Git هو الأداة القوية التي تعمل بصمت على حاسوبك، وتمنحك شبكة أمان لا مثيل لها. هو ما يعطيك الثقة لتجربة أفكار جديدة، لأنه يضمن لك دائمًا أن لديك نقطة عودة آمنة.

نبذة عن تاريخ Git: وُلِد من رحم الحاجة

قصة ولادة Git لا تقل إثارة عن قوة الأداة نفسها، وهي توضح لنا لماذا صُممت بهذه الطريقة الفعالة. بطل القصة هو لينوس تورفالدس (Linus Torvalds)، العقل المدبر وراء نظام التشغيل لينكس (Linux).

في أوائل الألفية، كان مشروع نواة لينكس (Linux Kernel) - وهو أحد أكبر المشاريع مفتوحة المصدر في العالم - يعتمد على نظام تحكم بالإصدارات تجاري يسمى BitKeeper.

في عام 2005، تغيرت سياسة الشركة وأصبح هذا النظام غير مجاني.

وجد لينوس نفسه وفريقه العالمي من المطورين في مأزق حقيقي. لم يجد أي نظام بديل يلبي متطلباتهم الصارمة:

1. السرعة الفائقة: كانوا بحاجة إلى نظام سريع جدًا للتعامل مع آلاف التعديلات اليومية.
2. النظام الموزع: كان بحاجة إلى نظام لا يعتمد على خادم مركزي، ليتمكن المطورون حول العالم من العمل بكفاءة.
3. الأمان والموثوقية: يجب أن يضمن النظام سلامة الكود بشكل مطلق.

وكما فعل عندما بنى نواة لينكس، قرر لينوس أن الحل الأفضل هو أن يبني الأداة بنفسه. بشكل مذهل، قام بتطوير النسخة الأولى من Git في أسبوعين فقط في أبريل 2005.

هذه القصة تخبرنا بكل شيء: Git لم يُصمم في شركة بهدف الربح، بل تم بناؤه بواسطة أحد أعظم مهندسي البرمجيات في العالم لحل إحدى أصعب مشاكل التطوير التعاوني. لهذا السبب، ستجد أن Git يتميز بالسرعة والكفاءة والقوة، لأنه وُلِد من رحم الضرورة القصوى.

كيف يعمل Git؟

لفهم قوة Git الحقيقية، نحتاج إلى التعمق أكثر في فلسفته. كما ذكرنا، Git يفكر في بياناته كسلسلة من اللقطات (Snapshots)، وليس مجرد "تغييرات".

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

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

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

1. مجلد العمل (Working Directory): أستوديو العمل الحي

هذا هو المفهوم الأسهل. إنه مجلد مشروعك الفعلي على حاسوبك، وهو ما تراه وتتفاعل معه في مستكشف الملفات في VS Code. إنه "الأستوديو" الذي تعمل فيه:

• مكان الإبداع: هنا تقوم بإنشاء ملفات جديدة، كتابة الكود، حذف الأكواد القديمة، وتجربة الأفكار.
• حالة حية ومتغيرة: الملفات في هذه المنطقة قد تكون مكتملة، أو نصف مكتملة، أو حتى تحتوي على أخطاء. إنها مساحة عملك الفوضوية أحيانًا، وهذا طبيعي تمامًا. Git يراقب هذه المنطقة ليرى أي تغييرات تحدث مقارنة بآخر لقطة محفوظة.

2. منطقة التجهيز (Staging Area): سر قوة Git وسر التحكم الدقيق

هذه هي المنطقة الأكثر أهمية والأقل فهمًا لدى المبتدئين، لكنها سر قوة Git. قد تسأل: "لماذا أحتاج إلى خطوة إضافية قبل الحفظ؟ لماذا لا أحفظ التغييرات مباشرة؟"

الجواب يكمن في القدرة على إنشاء "التزامات ذرية" (Atomic Commits).

فكر في هذا السيناريو: خلال الساعة الماضية، قمت بثلاثة أمور مختلفة في مشروعك:

1. أصلحت خطأً (bug) في ملف script.js.
2. أضفت قسمًا جديدًا في ملف index.html.
3. صححت خطأً إملائيًا في ملف style.css.

بدون منطقة التجهيز، ستضطر إلى حفظ كل هذه التغييرات غير المترابطة معًا في لقطة واحدة ورسالة واحدة مربكة مثل "قمت بالكثير من التعديلات".

لكن مع منطقة التجهيز، يمكنك أن تكون دقيقًا كالجراح. يمكنك استخدام أمر git add لتختار فقط التعديلات المتعلقة بإصلاح الخطأ وتضعها في منطقة التجهيز، ثم تقوم بعمل commit لها برسالة واضحة مثل "Fix: Correct login button behavior".

بعد ذلك، يمكنك تجهيز وحفظ التعديلات المتعلقة بالقسم الجديد بشكل منفصل.

إذًا، منطقة التجهيز هي مسودة لقطتك التالية. إنها تسمح لك بتجميع التغييرات المترابطة معًا بدقة، وإنشاء تاريخ مشروع نظيف ومنطقي وسهل الفهم، وهو أمر لا يقدر بثمن في المشاريع الاحترافية.

3. المستودع (Repository): الأرشيف الدائم والموثوق

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

عندما تقوم بعمل commit، فأنت لا تحفظ الملفات فقط. أنت تحفظ لقطة كاملة مع مجموعة من البيانات الوصفية (metadata) الهامة:

• معرّف فريد (hash): بصمة فريدة لهذه اللقطة.
• المؤلف والتاريخ: من قام بالتعديل ومتى.
• رسالة الـ Commit: الشرح الذي كتبته لوصف هذه اللقطة.
• مؤشر للقطة السابقة: كل لقطة تعرف تمامًا من هي اللقطة التي أتت قبلها، وهذا هو ما يشكل "تاريخ" المشروع.

وعندما نقول أن Git موزع، فهذا يعني أن هذا "الأرشيف" بالكامل، بكل تاريخه وبياناته، يتم نسخه بالكامل على حاسوب كل مطور في الفريق. هذا ما يجعله آمنًا وسريعًا.

باختصار، سير عملك يتلخص في هذه الرحلة المنظمة: مجلد العمل ── (تختار التعديلات بدقة عبر git add) ──> منطقة التجهيز ── (تحفظ اللقطة بشكل دائم عبر git commit) ──> المستودع.

هذه العملية المنهجية هي ما تحول كتابة الكود من نشاط فوضوي إلى ممارسة هندسية منضبطة.

ما هو GitHub؟ منزل مشروعك على السحابة

الآن بعد أن أتقنا فهم Git كأداة قوية تعمل على حاسوبنا المحلي، حان الوقت لنتعرف على شريكه الأشهر: GitHub.

إذا كان Git هو "محرك السيارة" القوي الذي يدير كل شيء محليًا، فإن GitHub هو "المرآب الآمن، حلبة السباق، والنادي الاجتماعي" لتلك السيارة على الإنترنت.

إنه خدمة ويب توفر استضافة لمستودعات Git الخاصة بك، لكنه أكثر من مجرد مساحة تخزين. يمكن تلخيص وظائفه الأساسية في ثلاث نقاط:

1. الخزنة الآمنة (النسخ الاحتياطي)

الوظيفة الأكثر بديهية لـ GitHub هي أنه يوفر نسخة احتياطية سحابية كاملة لمشروعك. عندما تقوم بـ"دفع" (push) الكود الخاص بك من حاسوبك المحلي إلى GitHub، فأنت تضع نسخة كاملة من "ألبوم الصور" (مستودعك) في خزنة آمنة على الإنترنت.

إذا تعطل حاسوبك أو سُرق، فإن عملك كله محفوظ وآمن.

2. مركز التعاون (العمل الجماعي)

هذه هي القوة الحقيقية لـ GitHub. إنه مصمم خصيصًا لتسهيل عمل الفرق البرمجية معًا على نفس المشروع. هو يوفر أدوات قوية لتنظيم العمل الجماعي، أهمها:

طلبات السحب (Pull Requests)

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

هذا الطلب هو بمثابة قولك للفريق: "لقد انتهيت من عملي، هل يمكنكم مراجعته قبل دمجه في المشروع الرئيسي؟". هذا يسمح بمراجعة الكود ومناقشته قبل أن يصبح جزءًا رسميًا من المشروع.

إدارة المشاكل (Issues)

يوفر نظامًا لتتبع الأخطاء (Bugs)، طلب الميزات الجديدة، وتنظيم المهام.

3. معرض الأعمال (ملفك الشخصي الاحترافي)

أصبح ملفك الشخصي على GitHub اليوم بمثابة سيرتك الذاتية التقنية.

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

إن امتلاك حساب GitHub نشط ومنظم هو أفضل طريقة لعرض مهاراتك للعالم.

باختصار، Git هو الأداة التي تدير بها عملك، و GitHub هو المنصة التي تشارك وتحمي وتُظهر بها هذا العمل للعالم.

(ملاحظة: GitHub هو الخدمة الأشهر، لكن هناك بدائل قوية جدًا تؤدي نفس الوظيفة مثل GitLab و Bitbucket).

لماذا تحتاج إلى نظام تحكم بالإصدارات؟

قبل أن نتعمق في الأوامر العملية، قد تسأل نفسك: "هل أحتاج حقًا لكل هذا التعقيد لمجرد حفظ ملفاتي؟".

الجواب القاطع هو نعم، والسبب يتجاوز مجرد الحفظ. استخدام نظام التحكم بالإصدارات (VCS) هو ما يفصل بين العمل العشوائي والممارسة الهندسية المنضبطة.

دعنا نعد إلى مشكلة "final_version_2_FINAL.docx" التي ذكرناها سابقًا. هذه الطريقة الفوضوية لا تقتصر على كونها غير منظمة، بل إنها تسبب مشاكل حقيقية:

• فقدان التاريخ: لا يمكنك أن تعرف بسهولة ما هي التغييرات التي أدت إلى "الإصدار النهائي" مقابل "الإصدار 2".
• خطر التجربة: إذا أردت تجربة فكرة جديدة قد لا تنجح، فستضطر إلى عمل نسخة أخرى من المشروع بالكامل، مما يزيد الفوضى.
• صعوبة التعاون: إذا أرسلت نسختك إلى زميل وقام هو بتعديلها، وأنت قمت بتعديلات أخرى على نسختك، فستصبح عملية دمج التغييرين معًا كابوسًا يدويًا.

نظام التحكم بالإصدارات مثل Git لا يحل هذه المشاكل فحسب، بل يمنحك قدرات خارقة:

سجل تاريخي كامل ومفصل

Git يسجل كل تغيير تقوم به في "التزام" (commit) مع رسالة توضح لماذا قمت بهذا التغيير. هذا يخلق سجلاً تاريخيًا واضحًا ومفصلاً يمكنك تصفحه في أي وقت. بعد ستة أشهر، عندما تتساءل عن سبب كتابة دالة معينة بهذه الطريقة، سيكون الجواب موجودًا في رسالة الـ commit.

شبكة الأمان المطلقة

هل قمت بحذف ملف عن طريق الخطأ؟ هل أضفت كودًا أفسد كل شيء؟ مع Git، لا يوجد ما يسمى بـ "خطأ لا يمكن إصلاحه". يمكنك العودة بالزمن إلى أي commit سابق كان فيه المشروع يعمل بشكل مثالي، واستعادة الملفات أو المشروع بأكمله في ثوانٍ.

التجربة والإبداع بلا خوف

هذه هي أجمل ميزة. من خلال "الفروع" (Branches)، يمكنك إنشاء نسخة معزولة من مشروعك لتجربة ميزة جديدة تمامًا.

يمكنك العمل على هذا الفرع، ارتكاب الأخطاء، وتجربة الأفكار الجذرية، كل ذلك دون المساس بالنسخة الرئيسية المستقرة من مشروعك.

إذا نجحت التجربة، يمكنك دمجها بسهولة. وإذا فشلت، يمكنك حذف الفرع وكأن شيئًا لم يكن.

أساس العمل الجماعي

Git مصمم من الألف إلى الياء للعمل الجماعي. هو يوفر آليات قوية لدمج التغييرات من عدة مطورين، حل التعارضات (Conflicts) التي قد تحدث، ومراجعة كود الزملاء قبل اعتماده. لا يمكن لأي فريق برمجي حديث أن يعمل بكفاءة بدونه.

باختصار، استخدام Git لا يتعلق فقط بحفظ الكود، بل يتعلق بامتلاك الثقة الكاملة في إدارة مشروعك، مما يحررك للتركيز على الإبداع وحل المشاكل بدلاً من القلق من فقدان العمل أو إفساده.

لنبدأ العمل: تثبيت Git على جهازك

الآن بعد أن فهمنا قوة Git وأهميته، حان الوقت لتجهيز أداتنا. تثبيت Git عملية بسيطة ومباشرة على جميع أنظمة التشغيل. اتبع الخطوات المناسبة لنظامك.

ويندوز (Windows)

أسهل طريقة لمستخدمي ويندوز هي عبر المثبت الرسمي:

1. تحميل المثبت: توجه إلى الموقع الرسمي لـ Git عبر الرابط: https://git-scm.com/download/win. سيقوم الموقع تلقائيًا ببدء تحميل النسخة المناسبة لنظامك.

2. تشغيل التثبيت: قم بتشغيل الملف الذي تم تحميله. ستظهر لك عدة شاشات من الخيارات.

نصيحة هامة: لا تقلق من كثرة الخيارات! ببساطة، اترك كل الإعدادات الافتراضية كما هي واضغط Next في كل مرة. الإعدادات الافتراضية ممتازة ومناسبة للجميع.

3. التحقق من التثبيت: بعد انتهاء التثبيت، افتح قائمة ابدأ، ابحث عن Git Bash وقم بتشغيله. اكتب الأمر التالي واضغط Enter:

git --version

إذا ظهر لك رقم الإصدار (مثل git version 2.42.0.windows.1)، فتهانينا، لقد تم التثبيت بنجاح.

ماك (macOS)

معظم أجهزة ماك تأتي مع Git مثبت مسبقًا. للتحقق، افتح تطبيق Terminal (يمكنك البحث عنه في Spotlight) واكتب:

git --version

إذا لم يكن مثبتًا، سيقوم نظام التشغيل تلقائيًا بعرض نافذة تطلب منك تثبيت "أدوات مطوري سطر الأوامر" (Command Line Developer Tools). وافق على التثبيت، وسيقوم النظام بتثبيت Git وكل ما تحتاجه.

طريقة بديلة (للمستخدمين المتقدمين): إذا كنت تستخدم مدير الحزم Homebrew، يمكنك تثبيت Git ببساطة عبر الأمر:

brew install git

لينكس (Linux)

تثبيت Git على لينكس مباشر جدًا لأنه غالبًا ما يكون في مستودعات البرامج الرسمية. افتح الطرفية (Terminal) واستخدم الأمر المناسب لتوزيعتك:

للتوزيعات المبنية على Debian/Ubuntu (مثل Ubuntu, Mint, Pop!_OS):

sudo apt update
sudo apt install git

للتوزيعات المبنية على Fedora/CentOS/RHEL:

sudo dnf install git

بعد انتهاء التثبيت، تحقق منه بنفس الطريقة عبر الأمر git --version.

الآن بعد أن أصبح Git مثبتًا على جهازك، أصبحت جاهزًا تمامًا لبدء استخدامه في مشروعنا الفعلي.

إنشاء مركزك على الإنترنت: إعداد حساب GitHub

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

الخطوات بسيطة ومباشرة:

1. توجه إلى الموقع الرئيسي: افتح متصفحك واذهب إلى موقع GitHub: https://github.com.

2. ابدأ عملية التسجيل: في الصفحة الرئيسية، ابحث عن زر "Sign up" وانقر عليه.

3. املأ بياناتك: سيطلب منك GitHub إدخال المعلومات الأساسية:

4. البريد الإلكتروني (Email): أدخل بريدًا إلكترونيًا صالحًا.

5. كلمة المرور (Password): اختر كلمة مرور قوية وآمنة.

6. اسم المستخدم (Username): اختر اسم مستخدم احترافي وفريد. نصيحة: من الأفضل استخدام اسم يعكس هويتك الحقيقية أو علامة تجارية شخصية، لأن هذا الاسم سيصبح جزءًا من سيرتك الذاتية التقنية.

7. التحقق والتخصيص: قد يطلب منك GitHub حل لغز بسيط لإثبات أنك لست روبوتًا، وقد يسألك بعض الأسئلة الاختيارية لتخصيص تجربتك.

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

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

التطبيق العملي: وضع مشروعنا تحت إدارة Git و GitHub

حان وقت التطبيق. سنأخذ الآن المشروع الذي بنيناه في الدروس السابقة (ملفات index.html, style.css, script.js) ونضعه تحت نظام تحكم احترافي. اتبع هذه الخطوات بدقة، وسأشرح لك "لماذا" وراء كل أمر نكتبه.

الخطوة 1: افتح المشروع والطرفية (Terminal)

افتح مجلد مشروعك في محرر VS Code. بعد ذلك، افتح الطرفية المدمجة بالضغط على `Ctrl + `` (الحرف ذ). وجود الطرفية داخل المحرر يجعل سير العمل سلسًا ويمنعك من التنقل بين النوافذ المختلفة.

الخطوة 2: تهيئة مستودع Git (ابدأ المراقبة)

قبل أن يتمكن Git من فعل أي شيء، يجب أن نخبره صراحةً أننا نريد منه البدء في تتبع هذا المجلد. اكتب الأمر التالي واضغط Enter:

git init

ماذا حدث للتو؟

لقد قمت بتنفيذ أول أمر Git لك! سيظهر لك رد مشابه لـ "Initialized empty Git repository...".

هذا يعني أن Git قد أنشأ مجلدًا مخفيًا جديدًا باسم .git. هذا المجلد هو "العقل" أو قاعدة البيانات الكاملة لمشروعك. سيتم تخزين كل لقطة، كل تغيير، وكل تاريخ لمشروعك هنا.

نصيحة مهمة: لا تقم أبدًا بتعديل أو حذف هذا المجلد يدويًا.

الخطوة 3: التحقق من الحالة وأول "التزام" (Commit)

الآن بعد أن بدأ Git بالمراقبة، كيف نعرف ما الذي يراه؟ استخدم الأمر الأكثر أهمية لتشخيص أي موقف في Git:

git status

سيظهر لك أن ملفاتك (index.html, etc.) موجودة تحت قسم "Untracked files" (ملفات غير متتبعة) وغالبًا ما تكون باللون الأحمر. هذا يعني: "مرحبًا، أنا أرى هذه الملفات، لكني لا أقوم بتتبع التغييرات عليها بعد. أنت لم تخبرني بأنها مهمة".

للقيام بأول حفظ في تاريخ المشروع، نتبع خطوتين:

1. إضافة الملفات إلى منطقة التجهيز: سنخبر Git الآن أننا نريد تضمين كل الملفات الحالية في لقطتنا الأولى.

git add .

(النقطة . هي اختصار لـ "أضف كل الملفات والمجلدات في هذا المجلد إلى منطقة التجهيز").

الآن، إذا كتبت git status مرة أخرى، ستجد أن الملفات أصبحت باللون الأخضر تحت "Changes to be committed"، مما يعني أنها جاهزة للحفظ.

2. حفظ اللقطة (Commit): الآن، سنقوم بأخذ اللقطة بشكل دائم في تاريخ المشروع مع رسالة وصفية واضحة.

git commit -m "Initial commit: Create HTML, CSS, and JavaScript files"

تهانينا! لقد قمت للتو بحفظ أول إصدار من مشروعك في تاريخ Git المحلي.

الخطوة 4: إنشاء المستودع البعيد على GitHub

الآن نحتاج إلى مكان آمن على الإنترنت لنضع فيه نسخة احتياطية. هذا المكان هو مستودع جديد سنقوم بإنشائه على حسابنا في GitHub.

1. اذهب إلى حسابك على GitHub.com وقم بتسجيل الدخول.

2. في الصفحة الرئيسية، ابحث عن زر "New" (جديد) الأخضر، أو انقر على علامة + في الزاوية العلوية اليمنى واختر New repository.

3. في صفحة "Create a new repository"، املأ البيانات كالتالي:

1. Repository name: my-first-website.
2. Description: (اختياري) "مشروعي الأول لتطبيق أساسيات HTML, CSS, و JavaScript".
3. Public: اتركه محددًا لجعل المشروع مرئيًا كجزء من معرض أعمالك.
4. اترك كل الخيارات الأخرى فارغة (لا تقم بإضافة README أو gitignore).
5. انقر على الزر الأخضر Create repository.

الخطوة 5: ربط المحلي بالبعيد ورفع الكود

سينقلك GitHub الآن إلى صفحة تعليمات تحتوي على الأوامر التي نحتاجها لبناء الجسر بين مستودعنا المحلي وهذا المستودع البعيد الفارغ.

ابحث عن القسم الذي عنوانه “…or push an existing repository from the command line” وانسخ السطرين الموجودين فيه.

الصق هذين السطرين في الطرفية في VS Code، واحدًا تلو الآخر، واضغط Enter بعد كل منهما. دعنا نفكك ما تعنيه هذه الأوامر:

1. الأمر الأول (بناء الجسر)

git remote add origin https://github.com/YourUsername/my-first-website.git

• git remote add: "يا Git، أضف اتصالاً بمستودع بعيد".
• origin: "سنطلق على هذا الاتصال اسم origin" (الاسم المتعارف عليه).
• https://...: "وهذا هو عنوان URL الخاص به".

2. الأمر الثاني (رفع الملفات)

بعد تنفيذ هذه الأوامر، قم بتحديث صفحة مستودعك على GitHub. ستجد كل ملفات مشروعك هناك! لقد نجحت في وضع مشروعك على منصة احترافية عالمية، وأصبح لديك تاريخ كامل وموثق لعملك.

git push -u origin main

• git push: "يا Git، قم بدفع (رفع) التزاماتي".
• origin: "ارفعها إلى الوجهة المسماة origin".
• main: "ارفع التغييرات الموجودة في فرعي المحلي المسمى main".

بعد تنفيذ هذه الأوامر، قم بتحديث صفحة مستودعك على GitHub.

ستجد كل ملفات مشروعك هناك! لقد نجحت في وضع مشروعك على منصة احترافية عالمية، وأصبح لديك تاريخ كامل وموثق لعملك.

سير العمل بعد الإعداد الأولي: كيف ترفع تعديلاتك المستقبلية؟

تهانينا! لقد قمت بالجزء الأصعب، وهو الإعداد الأولي. لكن ماذا عن الغد؟ ماذا تفعل عندما تضيف فقرة جديدة، أو تغير لون زر، أو تصلح خطأ ما؟

الجميل في الأمر أن دورة العمل اليومية أبسط بكثير. إنها حلقة متكررة من ثلاث خطوات ستصبح طبيعة ثانية لك. دعنا نطبقها الآن على مشروعنا:

الخطوة 1: قم بإجراء تعديل

افتح ملف index.html الخاص بك وقم بإجراء تغيير بسيط. على سبيل المثال، غيّر النص داخل وسم <h1> من "مدونتي التقنية" إلى "مدونتي التقنية الرائعة". احفظ الملف كالمعتاد (Ctrl+S).

الخطوة 2: احفظ اللقطة محليًا (Commit)

الآن، نحتاج إلى تسجيل هذا التغيير في "آلة الزمن" المحلية الخاصة بنا (Git). العملية هي نفسها تمامًا كما فعلنا في المرة الأولى:

1. جهز التعديلات: افتح الطرفية واستخدم الأمر التالي لإضافة كل التغييرات التي أجريتها إلى منطقة التجهيز.

git add .

2. احفظ اللقطة: الآن، قم بحفظ هذه التغييرات بشكل دائم في تاريخ مشروعك مع رسالة واضحة تصف ما قمت به.

git commit -m "Update main heading in header"

لقد أصبح تاريخك المحلي الآن يحتوي على لقطة جديدة ومحدثة.

الخطوة 3: ارفع التغييرات إلى GitHub (Push)

في هذه اللحظة، أصبح مستودعك المحلي "متقدمًا" بخطوة عن مستودعك على GitHub. آخر خطوة هي مزامنة هذين السجلين معًا. وبفضل الإعداد الذي قمنا به سابقًا، أصبح هذا الأمر سهلاً للغاية. كل ما عليك كتابته هو:

git push

هذا كل شيء! سيقوم Git بأخذ اللقطة الجديدة التي حفظتها ورفعها إلى مستودعك على GitHub. إذا ذهبت الآن إلى صفحة مشروعك على GitHub، ستجد أن ملف index.html قد تم تحديثه.

هذه الدورة المكونة من ثلاث خطوات (تعديل ⬅️ حفظ محلي commit ⬅️ رفع سحابي push) هي جوهر سير العمل اليومي لأي مطور يستخدم Git و GitHub. لقد أتقنت الآن العملية الكاملة من البداية إلى النهاية.

القوة الحقيقية لـ Git: التجربة بأمان مع الفروع (Branches)

حتى الآن، كنا نعمل على خط زمني واحد. نقوم بتغيير، نحفظه، وتاريخ مشروعنا يتقدم في خط مستقيم. هذا مثالي للتقدم الخطي البسيط.

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

هنا تكمن القوة والسحر الحقيقي لـ Git: التفريع (Branching).

ما هو الفرع؟

فكر في الفرع على أنه إنشاء عالم موازٍ أو نسخة للمسودة من مشروعك. النسخة الرئيسية لمشروعك تعيش على فرع يسمى عادةً main (أو master). هذه هي النسخة الرسمية والمستقرة.

عندما تنشئ فرعًا جديدًا، يقوم Git بإنشاء نسخة من مشروعك في تلك اللحظة بالضبط. يمكنك بعد ذلك الانتقال إلى هذا "العالم الموازي" الجديد والتجربة بحرية.

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

سير العمل الاحترافي: فرّع، احفظ، ادمج

سير العمل القياسي لأي مطور محترف هو عملية بسيطة من ثلاث خطوات:

1. فرّع (Branch): قبل البدء في مهمة جديدة (على سبيل المثال، إضافة نموذج اتصال)، تقوم بإنشاء فرع جديد من main وتعطيه اسمًا وصفيًا، مثل feature/contact-form.
2. احفظ (Commit): تقوم بكل عملك وحفظ كل التزاماتك (commits) على هذا الفرع الجديد feature/contact-form. يظل فرع main دون مساس ونظيفًا.
3. ادمج (Merge): بمجرد الانتهاء تمامًا من الميزة الجديدة واختبارها على فرعها، تقوم بعملية "دمج". هذا يشبه دمج العالم الموازي مرة أخرى في الخط الزمني الرئيسي. يقوم Git بذكاء بأخذ التغييرات التي أجريتها ويدمجها في فرع main، وتصبح ميزتك الجديدة جزءًا من المشروع الرسمي.

لماذا هذا مهم جدًا؟

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

بفهم هذا المفهوم للتفريع، أصبح لديك الآن صندوق الأدوات المفاهيمي الكامل للمطور الحديث.

أنت لا تعرف فقط كيفية حفظ تاريخ مشروعك، بل أيضًا كيفية إدارة خطوط زمنية متعددة وتطوير الميزات بطريقة آمنة ومنظمة واحترافية. بهذه المعرفة، أنت جاهز حقًا للخطوة التالية المثيرة.

لقد أصبحت مطورًا محترفًا!

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

لقد تعلمت في هذا الدليل ليس فقط كيفية استخدام Git و GitHub، بل لماذا هما أدوات لا غنى عنها. أنت الآن تمتلك شبكة الأمان التي تمنحك الثقة للتجربة والإبداع، والأساس الذي يمكنك من خلاله التعاون في مشاريع أكبر في المستقبل.

الآن بعد أن أصبح مشروعنا آمنًا ومنظمًا على GitHub، حان وقت الخطوة الأكثر إثارة على الإطلاق: مشاركة إنجازك مع العالم.

في مقالنا القادم، سنتعلم كيفية أخذ هذا المستودع من GitHub ونشره على الإنترنت ليكون متاحًا لأي شخص في أي مكان عبر رابط حي ومباشر. استعد للحظة الإطلاق!