أجمل إضافات محرر VS Code
أجمل إضافات محرر VS Code ِاركنا الإضافات التي تستعملها
Bracket Pair Colorizer 2
كثيرا ما تكتب الكثير من الاقواس داخل بعضها وهذه الإضافة تفيدك في تلوين الأقواس بألوان مختلفة لتسهيل قراءة الكود عليك ومعرفة بداية ونهاية كل قوس
Icon Fonts
تستطيع عن طريق هذه الإضافة كتابة اختصارات يمكن تحويلها ل Icons الخاصة بمكتبات ال Font Icons المشهورة مثل Font Awesome
Indent-Rainbow
دائما يكون لديك مشروع كبير ومتفرع ولديك عناصر داخل عناصر وهكذا وبواسطة هذه الإضافة سوف تجد الوان تحدد لك بداية ونهاية كل عنصر بلون مختلف لتسهل عليك قراءة الكود
Live Server
واحد من أهم الإضافات التي لا غنى عنها فهي تنشيء لك Local Server وتعطيك ميزة ال Hot Reload والتي تفيدك في عمل Refresh للصفحة تلقائيا عند عمل حفظ للملف الذي تعمل عليه
Prettier - Code formatter
من أهم الإضافات التي تحتاجها والتي تفيدك في تنسيق الكود عند عمل حفظ للملف. لا تعتمد عليها إذا كنت مبتديء حتى تستطيع تعلم التنسيق بشكل سليم ولكن في مرحلة المستوى المتوسط والمحترف سوف تحتاجها لتساعدك في تنسيق الكود وخصوصا لو قمت بالتعديل على كود شخص آخر غير منسق ولا تريد تضييع الوقت في التنسيق اليدوي وتعم على الكثير من اللغات
التعليقات
بعض الإضافات التي أعجبتني أضيفها:
Code Spell Checker -
itemName=streetsidesoftware.code-spell-checker
للتصحيح اللغوي للكلمات الإنجليزية في التعليقات والمتغيرات. مفيدة وتظهر أعمالك باحترافية
- Path Intellisense
itemName=christian-kohler.path-intellisense
للإكمال التلقائية للمسارات (للملفات والمجلدات)
- PHP DocBlocker
itemName=neilbrayfield.php-docblocker
مفيدة لكتابة توثيق php والإكمال التلقائي لها
لن يقتصر الأمر على تلك الإضافات فهناك إضافات رائعه أخرى يحتاجها كل مبرمج لراحة عينيه وخصوصاً في المشاريع الكبيره التى تحتاج لجلسات طويله ولتجعل الكود more readable
على سبيل المثال
Bracket Pair Colorizer
هذه الإضافه تقوم بتلوين الأقواس وهذه حقاً أداة رائعه حيث انك في كثير من الأحوال تقوم بكتابة دوال functions متداخله وتكرارات بإستخدام for loop مما يجعل الكود الغير ملون وصعب قرائته
CodeSnap
تقوم هذه الأداه الرائعه بإلتقاط صوره من كودك لنشره بشكل جميل
كل ما عليك فعله هو
الضغط على ctrl + shift + p
ثم سيظهر لك شريط البحث أكتب فيه code snap
ثم سيظهر على الجانب الايمن الأداة قم بعمل تظليل على الكود وستجد الكود يظهر الناحية الاخرى على هيئة صورة
colorize
هذه الاداة جميله جداً للالوان وخصوصاً لو أردت أن تجعل أي قيمه تحمل لوناً في كود CSS ملوناً بالكامل
تستطيع تجربة فكرتها فهي رائعه
CSS Peek
إن اردت أن تقوم بروئية كود CSS دون الدخول على ملف الاستايل الخاص بالموقع فتسطيع من خلال تلك الأداة عرض كود CSS الخاص بتاج HTML دون الدخول بالضغط مرتين على التاج بجانب أنك تستطيع التعديل على الكود
Draw.io
تستطيع من خلال تلك الأداه أن تقوم بعمل مخططات بيانيه واحصائيه تساعدك بطريقه سهله ومنظمه
كما يمكنك عمل مخططات pseudo code فالبرنامج بسيط جدا وتستطيع تعلمه في خلال جلسة واحده
كل ما عليك فعله هو فتح ملف جديد وأن تجعله بالإمتداد test.drawio وسوف تقرئه الأداه مباشرة
indent-rainbow
بدلاً من مسافات عاديه هذه الأداه تجعل المسافات indentation ملونه ممكن يجعل السطور أكثر سهوله في قرائتها