5 امتدادات وسمات لـ VS Code يمكنها تغيير حياة مطور الواجهة الأمامية

يريد مؤلف المقال ، الذي ننشر ترجمته اليوم ، التحدث عن العديد من الإضافات والمواضيع لمحرر VS Code الشهير الذي يمكن أن يحسن حياة المطور.



SCSS التحسس الذكي


SCSS التحسس الصفحة

إنشاء المتغيرات في SCSS سهل وممتع. كيف تتذكرهم؟ هنا عادة ما تنشأ صعوبات مع هذا.

إذا كنت مثلي ، فأنت لديك ملف _variables.scss ، والذي يحتوي على مئات الرموز بالدولار وأسماء المتغيرات التي تتبادر إلى ذهنك في الساعة الثالثة صباحًا. يوفر ملحق SCSS IntelliSense تلميحات للأسماء المتغيرة عند العمل على رمز المشروع. ولم تعد بحاجة إلى تذكر هذه الأسماء بالتفصيل الكامل. لا حاجة للبحث في ملف به أسماء متغيرة حتى تتذكره.

إليك ما يبدو عليه امتداد SCSS IntelliSense.


التحسس الذكي SCSS التمديد في العمل

إعادة تسمية العلامة التلقائي


صفحة إعادة تسمية السيارات

بغض النظر عن الإطار الأمامي الذي تستخدمه ، يمكن أن تكون كتابة HTML (أو JSX) مهمة شاقة. خاصة في الحالة التي يوجد فيها ما يقرب من 50 سطرًا من بعض الرموز بين علامتي الفتح والإغلاق. قد تحتاج إلى تغيير علامة H2 إلى H3 أثناء عملك. قد يكون من الضروري استبدال div بفترة. في أي حال ، إذا قمت بحل مثل هذه المشكلات دون استخدام الأدوات المساعدة ، فإنها في أجزاء التعليمات البرمجية واسعة النطاق ، تأتي في عملية بحث صعبة عن علامات الإغلاق.

لماذا لا تتصل بسيارة لمساعدتك في تعديل العلامات تلقائيًا؟ للقيام بذلك ، فقط استخدم ملحق Auto Rename Tag. فإنه ، عند تحرير علامة الافتتاح ، يتغير ويغلق تلقائيا. يحدث الشيء نفسه ، على العكس تمامًا ، في حالة تغيير علامة الإغلاق.

إليك كيفية عمل علامة إعادة التسمية التلقائية.


العمل مع Auto Rename Tag Extension

عمل مكرر


مكررة صفحة العمل

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

في الواقع ، من أجل تزويد VS Code بالميزة الموضحة أعلاه ، يكفي تثبيت ملحق Duplicate Action. عند تشغيله ، يمتلك المطور أمر قائمة سياق Duplicate file or directory .


يتكرر ملحق الإجراء وتغيير قائمة سياق الملف

CodeStream


CodeStream الصفحة

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

العديد من المبرمجين لا يحبون ترك IDE الخاص بهم. ولكن من أجل شرح شيء للزملاء ، وطرح الأسئلة بنفسك ، يجب عليك الخروج من البيئة المألوفة واستخدام Trello و Slack و Asana و Bitbucket و Microsoft Teams. يدعم CodeStream العديد من الأدوات و IDE ، مما يتيح لك التعامل مع المشكلات والأسئلة دون ترك البيئة المألوفة لمحرر التعليمات البرمجية. ويميل الكثيرون ممن يقومون بعمل ما إلى "حالة التدفق". عادة ما يؤدي خروج المحرر إلى إخراج الشخص من هذه الحالة. بفضل CodeStream ، يمكن حل الأسئلة المتعلقة بالكود دون ترك بيئة مألوفة لديك.


مناقشة التعليمات البرمجية في CodeStream

بومة الليل


ليلة البومة الصفحة

Night Owl هي واحدة من أفضل الموضوعات التي تم إنشاؤها على الإطلاق لـ IDE. لمدة ثلاث سنوات حتى الآن ، وأنا استخدامها يوميا. يوجد أدناه لقطة شاشة لشاشة العمل الحقيقية. يشير عنوان هذا الموضوع إلى أنه مخصص للأشخاص الذين يجلسون على الكمبيوتر ليلًا. صحيح ، إنه مناسب تمامًا للعمل الليلي ، مما يمنع عينيك من الإرهاق ، كما أن النغمات الزرقاء الناعمة المستخدمة فيه تساعد في حل المشكلات المعقدة بهدوء.


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

المكافأة: Synthwave '84 الموضوع


Synthwave '84 الصفحة

هذا الموضوع يأتي من الكون السايبربانك. سارت الامور بشكل جيد مع عباءة جلدية ، مع لامبورغيني Countach ومولد الدخان. إذا كان كل هذا قريبًا منك ، فقم بتشغيل موسيقى Vaporwave المفضلة لديك واكتب رمزك الجميل حتى ينضم وعيك إلى قاعدة بيانات Neuromancer.

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


Synthwave '84 الموضوع

أعزائي القراء! هل تعرف أي ملحقات وموضوعات مثيرة للاهتمام لرمز VS؟

Source: https://habr.com/ru/post/ar482468/


All Articles