ویژوال استودیو کد ، توسط مایکروسافت نگهداری میشود و یکی از محبوب ترین ویرایشگر های کد منبع باز موجود است .
هدف آن ، ارائه تمام ابزار های مورد نیاز شما برای کد نویسی است و کار با آن  از کار با بقیه  IDE ها راحت تر است.
بسیاری از برنامه نویسان ، ویژوال استودیو را ترجیح می دهند زیرا افزونه های زیادی را برای عملکرد، بهره وری، اشکال زدایی و سرعت بیشتر ارائه می دهد.

در این مقاله ، ما به 10 افزونه برتر VS Code خواهیم پرداخت.

این افزونه ها چگونه می توانند زندگی کدنویسی شما را آسان تر کنند ؟

با ما همراه باشید
– – – – – – – – – – – – – – – –  – – – – – – – – – – – – – – – – – – – – – –

این افزونه ها را برای هر برنامه نویسی واجب است 

• Bracket Pair Colorizer
• Better Comments
• Snippets
• CSS Peak
• Prettier
• Relative Path
• Icons
• Git Lens
• Import Cost
• Markdown All in One

1)  Bracket Pair Colorizer

این افزونه ویژوال کروشه های مربوط به هم را با یک رنگ مطابقت میدهد. زمانی که از توابع یا حلقه های دو در تو یا اجزایی که پرانتز ها و کروشه های زیادی دارند استفاده میکنید، کمک بزگ این افزونه به چشم میاید و باعث میشود که دیگر زمانی را صرف پیدا کردن و تشخیص پرانتز های مرتبط  نکنید .

با این افزونه ساده، پیدا کردن پرانتز های مرتبط و درک کد شما بسیار آسان تر میشود. همچنین خوانایی کد شما برای دیگران هم راحت تر میشود اگر آنها هم این افزونه را داشته باشند.

2) Better Comments

این افزونه برای نوشتن کامنت های زیبا و مرتب است ، که برای شما و افرادی که کدتان را میخوانند (مخصوصا برای تیم ها) بسیار مفید است. با استفاده از آن کامنت های شما بهتر خوانده میشوند و بهتر درک میشوند و همچنین زمان فهمیدن و درک کد با نوشتن کامنت ها کمتر میشود .

با استفاده از این افزونه شما میتوانید از کاراکتر های زیر بعد از دابل اسلش ( // ) برا تنوع رنگ استفاده کنید .

• ( * )   برای متن های هایلایت شده
• ( ! )   برای اختار ها و هشدار ها
• ( ؟ )   براس سوال ها و ابهامات
• ( todo )   برای کارهایی که میخواهید انجام دهید

3)Snippets

این فزونه یک افزونه بسیار عالی و با کارایی های بالا است. Snippets مجموعه ای از پسوند های مختلف برای رایج ترین زبان های برنامه نویسی است . به عنوان مثال React Snippet یکی از معروف ترین بخش های آن میباشد که به شما اجازه میدهد که برای کارهایی که بارها و بارها قصد تکرار آن را دارید یک شورت کات بسازید .

برخی از  بخش های معروف این افزونه :

• Angular Snippets (version 11)
• Python
• JavaScript (ES6) code snippets
• HTML Snippets
• Vue 3 Snippets

به عنوان جاوا اسکریپت

4) CSS Peak

این افزونه ویژوال یک افزونه عالی برای برنامه نویسان وب است. به شما اجازه میدهد که به استایل های کلاس ها و IDهای Css و تگ های Html نگاه بیاندازید.
این افزونه مشابه Brackets feature است و آن راCss Inline Editors نیز مینامند .

Css Peak از (symbol definition tracking) برای هر انتخابگر Css پشتیبانی میکند به عنوان مثال :

• Peek  : یک فایل Css را به صورت Inline برای ویرایش سریع بارگزاری کنید ( Ctrl+Shift+F12 )
• Go To : پرش مستقیم به فایل Css ( F12 )
• Hover : زمانی که موس را روی نماد قرار میدهید توضیحات آن نمایش داده میشوند ( Ctrl+hover )

5)Prettier

این افزونه یک قالب دهنده است که به ثابت نگه داشتن استایل کد شما کمک میکند . شما میتوانید تنظیمات خود را هر طور که نیاز دارید پیکربندی کنید و آن را با میانبر ها ( شورت کات ها ) ذخیره کنید.

Prettier یکی از محبوب ترین قالب دهنده های کد موجود است با بیشتر از 38.5 هزار امتیاز در گین هاب این افزونه به طور خودکار مشکلات قالب‌بندی را در کد شما برطرف می‌کند، مانند رفع ترکیبی از گیومه‌های تکی و دوگانه یا استفاده نامنظم از نقطه‌ ویرگول ( ; ) .

این افزونه برای زبان های برنامه نویسی زیر استفاده میشود :
JavaScript, TypeScript, Java, JSON, CSS, HTML, Vue, Angular, Markdown, YAML و موارد دیگر .

6)Relative Path

این افزونه یک افزونه عالی برای نوشتن import statements  است .
شما به راحتی می توانید مسیر نسبی هر فایلی را با استفاده از میانبرهای موجود در فضای کد نویسی خود دریافت کنید.
به جای جستجوی مکان فایل، فقط به نام فایل نیاز دارید و پسوند مسیر نسبی را از مکان فعلی به آن فایل مورد نظر ارائه می دهد.

7) Icons

این افزونه به شما امکان می دهد آیکون های توصیفی ایجاد کنید تا به تمایز بین فایل ها و پوشه ها کمک کنید.
این باعث می‌شود کد شما بصری‌تر و زیبا تر شود.
به عنوان مثال، می توانید رنگ نماد یک پوشه پیش فرض را با استفاده از command palette تغییر دهید.

چند پسوند آیکون مختلف از جمله وجود دارد :

• vscode-icons
• Material Icon Theme
• Material Theme Icons
• Simple icons

8) GitLens

این افزونه قابلیت های Git را با ویژوال استودیو ترکیب می کند که به شما امکان می دهد تالیف کد را از طریق Git تجسم کنید.
GitLens برای درک بهتر کد عالی است، بنابراین می توانید بفهمید و یاد بگیرید که چه کسی، چرا و چه زمانی کد تغییر داده است. به شما امکان می دهد تاریخچه و تکامل یک پایگاه کد را کشف کنید.

همچنین ویژگی های زیادی دارد به عنوان مثال :

• ناوبری تجدید نظر در تاریخچه فایل
• حاشیه نویسی سرزنش خط فعلی در انتهای خط که ارتکاب را نشان می دهد

9)Import Cost

این افزونه با نشان دادن سایز تغریبی بسته های import در کد ، به بهره وری  کد ما کمک میکند .
به این وسیله کمک میکند تا با ردیابی وابستگی های اضافه شده ، از مشکلات جلوگیری کند.

اگر مقدار حجم import شده خیلی زیاد باشد ، این افزونه به شما هشدار میدهد تا بتوانید بر اساس الزاماتی که خودتان تنظیم کرده اید مجدد پیکربندی کنید .

10) Markdown all in one

این افزونه ویژوال استودیو یک افزونه بسیار مفید برای همه چیز هایی است که مربوط به Markdown است .

ویژگی هایی مانند auto-preview, shortcuts, syntax autocomplete و . . .
Markdown معمولاً در بسیاری از زمینه‌های فناوری استفاده می‌شود و این افزونه کار با آن را آسان‌تر می‌کند و بهره‌وری و سرعت را افزایش می‌دهد.

با این افزونه می توانید از میانبرها برای تغییر متن و اضافه کردن مواردی مانند پررنگ، کج و غیره استفاده کنید . همچنین دارای اتوماسیون های مفیدی برای کار با مواردی مانند لیست ها و ریاضیات است. در اینجا چند دستور رایج وجود دارد:

• Create Table of Contents
• Remove section numbers
• Toggle code block
• Print current document to HTML

مقاله پیشنهادیه ما به شما :

 سالیدیتی زبان قرارداد های هوشند بر روی شبکه اتریوم ,  پنجره Cmd چیست و از آن چه استفاده ای میشود؟  ،  قابلیت های جدید سرویس هاس گوگل ، فناوری و زخیره سازی محاسباتی