كيفية التهيئة مقابل التعليمات البرمجية للبرمجة

يعد Visual Studio Code (VS Code) أحد برامج تحرير الأكواد الأكثر تفضيلاً لدى المطورين. يسمح لك التخصيص العالي بتكييف بيئة التطوير وفقًا لاحتياجاتك تمامًا.

بدءًا من التثبيت وحتى تكوين السمات والإضافات واختصارات لوحة المفاتيح، يوفر VS Code خيارات لا حصر لها لتحسين إنتاجيتك.

سترشدك هذه المقالة خلال الخطوات الأساسية لإعداد VS Code للبرمجة.

تثبيت رمز VS

تنزيل المثبت

لبدء إعداد VS Code، الخطوة الأولى هي تنزيل برنامج التثبيت. انتقل إلى موقع VS Code الرسمي وانقر على زر التنزيل.

سيقوم الموقع تلقائيًا بالتعرف على نظام التشغيل الخاص بك وتوفير المثبت المناسب.

تشغيل التثبيت

بمجرد اكتمال التنزيل، انقر فوق الملف الذي تم تنزيله لبدء التثبيت. اتبع التعليمات التي تظهر على الشاشة بالنقر على "التالي" في الخطوات.

ولا تنس قبول شروط الاستخدام. اختر المجلد الذي سيتم تثبيت VS Code عليه ثم تابع.

تكوين المسار

في خطوة التثبيت النهائية، حدد خيار "Add to PATH". يعد هذا أمرًا ضروريًا حتى تتمكن من فتح VS Code مباشرةً من الجهاز باستخدام الأمر شفرة.

بعد تحديد هذا الخيار، انقر فوق "تثبيت"، وعندما يكتمل التثبيت، انقر فوق "إنهاء" لإكماله.

مستعد! تم الآن تثبيت VS Code وتكوينه على نظامك. دعنا ننتقل إلى الخطوة التالية ونبدأ في استكشاف ميزات أداة البرمجة القوية هذه.

اختيار السمات وأنظمة الألوان

الوصول إلى التفضيلات

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

المواضيع الشعبية

هناك العديد من السمات الشائعة التي يمكنها تخصيص المحرر حسب رغبتك. بعض من أشهرها هي:

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

تخصيص الموضوع الخاص بك

إذا لم يعجبك أي من السمات الافتراضية، فيمكنك تخصيص السمات الخاصة بك. وصول ملف > التفضيلات > الإعدادات والبحث عن Workbench.colorCustomizations.

هنا، يمكنك ضبط ألوان العناصر المختلفة لواجهة VS Code.

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

باستخدام هذه النصائح، يمكنك جعل VS Code خاصًا بك وجعل البرمجة أكثر متعة!

تثبيت الملحقات الأساسية

استكشاف السوق

لتثبيت الملحقات في VS Code، انتقل إلى Marketplace. السوق هو المكان الذي تجد فيه جميع الامتدادات المتاحة لـ VS Code. للوصول إليه:

1. افتح رمز VS.
2. انقر على أيقونة الامتدادات في الشريط الجانبي الأيسر أو اضغط على السيطرة + التحول + X.
3. استخدم شريط البحث للعثور على الإضافات التي تريدها.
4. انقر ثَبَّتَ لإضافة الامتداد إلى رمز VS الخاص بك.

الملحقات الموصى بها

فيما يلي بعض الإضافات التي يمكنها تحسين إنتاجيتك بشكل كبير:

• إعادة تسمية العلامة تلقائيًا: يقوم تلقائيًا بإعادة تسمية علامات HTML المقابلة عندما تقوم بتغيير إحداها.
• تسليط الضوء على اللون: يقوم بتمييز الألوان الموجودة في كود CSS الخاص بك، مما يسهل رؤية الألوان المستخدمة.
• خادم مباشر: يقوم بإنشاء خادم محلي يقوم بتحديث صفحتك تلقائيًا في المتصفح كلما قمت بحفظ ملف.
• أجمل: يقوم بتنسيق التعليمات البرمجية الخاصة بك تلقائيًا، مما يضمن أسلوبًا متسقًا.
• ESLint: يقوم بتحليل كود JavaScript الخاص بك بحثًا عن الأخطاء ومشكلات النمط.
• GitLens: يعمل على تحسين تكامل Git في VS Code من خلال عرض معلومات مفصلة حول الالتزامات والمؤلفين.

إدارة ملحقاتك

بعد تثبيت بعض الملحقات، قد ترغب في إدارتها. لذلك:

1. افتح لوحة الملحقات (السيطرة + التحول + X).
2. انقر على أيقونة الترس بجوار الامتداد الذي تريد إدارته.
3. يمكنك تعطيل الامتداد أو إلغاء تثبيته أو تكوينه حسب الحاجة.

يتذكر: أقل هو أكثر. قم فقط بتثبيت الامتدادات التي ستستخدمها بالفعل لتجنب التحميل الزائد على محررك.

تكوين تنسيق التعليمات البرمجية

ضبط تفضيلات التنسيق

يمكنك ضبط تفضيلات تنسيق التعليمات البرمجية الخاصة بك في VS Code. الوصول إلى الإعدادات بالضغط السيطرة (كمد) + , وابحث عن "التنسيق عند الحفظ".

قم بتمكين هذا الخيار بحيث يتم تنسيق الكود تلقائيًا عندما تقوم بحفظ ملف.

التنسيق عند الحفظ

إحدى ميزات VS Code الأكثر فائدة هي التنسيق التلقائي عند الحفظ. وهذا يضمن أن الكود الخاص بك نظيف ومنظم دائمًا.

لتمكين هذا الخيار، أضف السطر التالي إلى ملفك settings.json:

{
    "editor.formatOnSave": صحيح
}

استخدام أجمل وأدوات أخرى

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

1. قم بتثبيت ملحق Prettier في VS Code.
2. أضف إعدادات أجمل إلى settings.json:

{
    "editor.defaultFormatter": "esbenp.prettier-vscode",
    "[جافا سكريبت]": {
        "editor.defaultFormatter": "esbenp.prettier-vscode"
    }
}

الآن، في كل مرة تقوم فيها بحفظ ملف، سيقوم Prettier بتنسيق الكود تلقائيًا.

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

جرب أدوات مختلفة وابحث عن الأداة التي تناسب سير عملك.

تخصيص اختصارات لوحة المفاتيح

الوصول إلى إعدادات الاختصارات

لتخصيص اختصارات لوحة المفاتيح في VS Code، انتقل إلى لوحة الأوامر بالضغط على Ctrl + Shift + P واكتب التفضيلات: افتح اختصارات لوحة المفاتيح.

سيؤدي هذا إلى فتح علامة تبويب جديدة حيث يمكنك عرض وتعديل جميع الاختصارات المتاحة.

إنشاء اختصارات جديدة

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

تذكر أن تختار مجموعات لا تتعارض مع الأوامر المهمة الأخرى.

استيراد وتصدير الإعدادات

إذا كنت تستخدم VS Code على أجهزة مختلفة، فقد يكون من المفيد تصدير إعدادات الاختصارات الخاصة بك. اذهب الى F1 > التفضيلات: افتح الإعدادات (JSON) وانسخ الإعدادات المطلوبة.

للاستيراد، ما عليك سوى لصق هذه الإعدادات في الملف settings.json من الجهاز الجديد.

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

التكامل مع جيت

تكوين Git في VS Code

يتمتع Visual Studio Code بتكامل أصلي مع أنظمة التحكم في الإصدار مثل Git.

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

يمكنك تهيئة مستودع Git والالتزام والدفع والسحب وعرض التغييرات وإدارتها مباشرة في المحرر.

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

باستخدام جيت لينس

يعد GitLens امتدادًا قويًا يعمل على تحسين تكامل Git في VS Code. ومن خلاله، يمكنك عرض سجل الالتزام ومقارنة التغييرات والمزيد.

لتثبيت جيتلينس:

1. انتقل إلى علامة تبويب الملحقات في VS Code.
2. ابحث عن "GitLens" وانقر على "تثبيت".
3. بعد التثبيت، استكشف الميزات الجديدة المتوفرة في لوحة تحكم المصدر.

أداء الالتزامات والدفعات

للالتزام والدفع في VS Code:

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

إن دمج Git مع VS Code يجعل التحكم في الإصدار أمرًا سهلاً، مما يسمح لك بإدارة التعليمات البرمجية الخاصة بك بكفاءة وتنظيم، كل ذلك في مكان واحد.

استخدام المحطة المتكاملة

فتح المحطة

لفتح الوحدة الطرفية المضمنة في VS Code، استخدم الاختصار `Ctrl + \

(ويندوز/لينكس) أوكمد + `(ماك). سيؤدي هذا إلى فتح الوحدة الطرفية أسفل نافذة VS Code، مما يسمح لك بتشغيل الأوامر دون مغادرة المحرر.

التنقل وتنفيذ الأوامر

تعمل المحطة المتكاملة مثل أي محطة أخرى. يمكنك التنقل بين الدلائل وتشغيل البرامج النصية وتثبيت الحزم والمزيد. فيما يلي بعض الأوامر المفيدة:

• قرص مضغوط لتغيير الدليل.
• ليرة سورية أو يقول لسرد الملفات والدلائل.
• تثبيت npm لتثبيت تبعيات مشروع Node.js.
• بيثون script.py لتشغيل برنامج بايثون النصي.

تتيح لك الوحدة الطرفية المدمجة التحكم بشكل أكبر في بيئة التطوير الخاصة بك دون الحاجة إلى التبديل بين النوافذ أو التطبيقات المختلفة.

الخاتمة

يعد إعداد Visual Studio Code للبرمجة عملية جديرة بالاهتمام حيث يقدم المحرر مجموعة واسعة من الوظائف وخيارات التخصيص.

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

استفد من النصائح وحوّل VS Code إلى حليفك الرئيسي عند البرمجة!