أهم إضافات محرر الأكواد VS Code

تحدثنا في المقال السابق عن برنامج الفيجوال ستوديو كود VS Code، وأفضل الثيمات التي يستخدمها الملايين وأتفق عليها أغلب المطورين حول العالم.

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

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

إخترنا لك في هذه التدوينة أهم وأشهر هذه الإضافات لنوفر عليك عناء البحث، فتابع معنا.

 

Live Server

 

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

والميزة الكبرى لهذه الإضافة هو أنها تقوم بإعادة تحميل الصفحة تلقائياً بعد كل شيء تكتبه أو تغيره في الكود الخاص بك.

 

Prettier

 

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

إضافة ممتازة لجعل الصفحة التي تعمل عليها منظمة لمن يقرأها من بعدك أو حتى لك أنت إذا رجعت لها بعد زمن لعمل تعديل أو شىء ما.

 

إقرأ أيضاً: كل ما تحتاج معرفته عن الذكاء الاصطناعي (AI) دليل شامل

 

Auto Rename Tag

 

إذا كان هناك أي وسم تريد تغييره فسوف تتضر إلى إعادة تسمية كل وسم على حدى إن لم يكن لديك هذه الإضافة.

تتيح لك ميزة تعديل اسم الوسم الآخر بالتزامن مع الوسم الأول الذي تقوم بتعديله، والذي يوفر عليك الوقت.

 

Bracket Pair Colorize

 

تقوم هذه الإضافة بتلوين الأقواس بالوان مختلفه، وتظهر أهمية هذه الإضافة أثناء كتابة الكود.

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

 

Material Icon Theme

 

جميع الملفات والفولدرات في برنامج VS Code تبدو مثل بعض لا جديد بها، مما قد يؤدي بك إلى بعض الملل.

ولكي تكسر هذا الملل تأتي هذه الإضافة والتي تتيح لك إمكانية إعطاء كل ملف وفولدر Icon أو صورة مميزة خاصة به ومختلفة تماماً عن الصور الافتراضية للبرنامج.

 

Polacode

 

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

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

 

Rainbow Tags

 

تقوم هذه الإضافة بتلوين العناصر والوسوم Tags تلقائياً، لتجعل الكود أكثر تنظيماً واسهل في القراءة.

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

 

إقرأ أيضاً: 10 طرق لتحسين أداء أي موقع وردبريس wordpress performance

 

Live Sass Compiler

 

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

تقوم هذه الإضافة بترجمة وتحويل الكود تلقائياً وبدون تدخل منك إلى لغة CSS، لكي يفهمها المتصفح.

 

 

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

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