ویرایشگر کد اپن سورس ویژوال استودیو کد (Visual Studio Code یا vscode) یکی از بهترین ویرایشگرهایی است که توانست در مدت زمان کم محبوبیت بسیار بالایی را بین توسعه‌دهندگان داشته باشد. قابلیت مهمی که هر ویرایشگر کد می‌بایست وجود داشته باشد، پلاگین‌ها هستند. خوشبختانه توسعه دهندگان زیادی اقدام به تولید اکستنشن‌های بسیار مفید برای ویژوال استودیو کد کرده‌اند که مخزن افزونه‌های این ویرایشگر را تبدیل به رقیبی جدی و شاید بی رقیب برای دیگر ویرایشگرهای کد معروف کرده‌است. در این مقاله چند مورد از آن‌ها را برای توسعه دهندگان وب معرفی میکنم.

Live Server Visual Studio Code Extension

۱ - Live Server

قطعاً یکی از ابزارهای بسیار ضروری برای توسعه دهندگان وب، دیدن آنی تغییرات اعمالی به کدشان هست. این اکستنشن در سیستم شما یک local server با قابلیت reload راه اندازی می‌کند که میتوانید تغییراتی که به کدهایتان می‌دهید را بدون رفرش کردن صفحه مرورگرتان بصورت زنده مشاهده کنید.

دانلود Live Server Material Icon Theme Visual Studio Code Extension

۲ - Material Icon Theme

کاربران و مخصوصا برنامه نویسان معمولا دوست دارند اپلیکیشن‌های خود را شخصی سازی کنند. خوشبخانه vscode علاوه بر امکان دادن تغییر تم نرم افزار، اجازه شخصی سازی آیکن‌ها را نیز به کاربرانش می‌دهد. این آیکن ست با زبان طراحی Material Design شرکت گوگل همخوانی دارد و ظاهر بسیار زیبایی به آیکن‌های vscode می‌دهد.

دانلود Material Icon Theme Material Theme Visual Studio Code Extension

۳ - Material Theme

زبان طراحی Material Design گوگل یکی از زیباترین و کامل‌ترین زبان‌های طراحی می‌باشد که مورد پسند طیف عظیمی از افراد است. با استفاده از این اکستنشن vscode خود را هماهنگ با متریال دیزاین کنید و از رابط کاربری آن لذت ببرید.

دانلود Material Theme Auto Rename Tag Visual Studio Code Extension

۴ - Auto Rename Tag

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

دانلود Auto Rename Tag Nord Visual Studio Code Extension

۵ - Nord

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

دانلود Nord Monokai Pro Visual Studio Code Extension

۶ - Monokai Pro

مهم‌ترین هدف توسعه دهنده‌ی Monokai Pro، تمرکز شما روی کدتان هست. اگر میخواهید آیکن‌ها، رنگ‌ها و ظاهر vscodeتان یکدست و حرفه‌ای باشند، Monokai Pro را باید یکی از انتخاب‌هایتان قرار دهید.

دانلود Monokai Pro Prettier Visual Studio Code Extension

۷ - Prettier

میخواهید کدهای تمیزی داشته باشید ولی وقت و حوصله کافی برای تنظیم فاصله‌ها و غیره که کد شما را حرفه‌ای میکنند ندارید؟ Prettier قوانین خاصی دارد، حداکثر طول خط کد شما را در نظر می‌گیرد و باعث تمیزی و حفظ سبک کدنویسی می‌شود.

دانلود Prettier Better Comments Visual Studio Code Extension

۸ - Better Comments

خیلی از توسعه دهندگان شاید توجه کافی به کامنت گذاری نمی‌کنند و به همین خاطر در آینده دچار مشکل میشوند. با Better Comments، کامنت‌های خود را در دسته بندی‌های هشدارها، کوئری‌ها، TODOها، هایلایت و ... طبقه‌بندی کنید و از کامنت‌گذاری لذت ببرید.

دانلود Better Comments Better Align Visual Studio Code Extension

۹ - Better Align

اگر طرفدار سبکی از کد نویسی هستید که در آن کولون (:) یا علامت‌های انتساب (=, =+, =-, =*, =/) و فلش (<=, =>) زیر هم قرار گرفته و تراز شده‌اند؛ Better Align این کار را برای شما خیلی راحت و سریع انجام می‌دهد.

دانلود Better Align CSSTree validator Visual Studio Code Extension

۱۰ - CSSTree validator

اگر می‌خواهید خطای کدهایی که در css می‌نویسید را فورا تشخصی دهید، CSSTree validator این کار را منطبق با استاندارد W3C برای شما انجام می‌دهد.

دانلود CSSTree validator

امیدوارم این اکستنشن‌ها را استفاده کرده و کدهای خودتان را راحت‌تر و سریع‌تر بنویسید. خوشحال میشوم نظر شما راجع به اکستنشن‌های معرفی شده را بدانم و اگر نکات مثبت و منفی هنگام کار با این اکستنشن‌ها متوجه شده‌اید و اکستنشن‌های مفیدی دیگری استفاده می‌کنید که فکر میکنید توسعه دهندگان وب میتوانند از آن‌ها استفاده کنند؛ زیر این مطلب بنویسید.

Email Share Icon Facebook Share Icon LinkedIn Share Icon Twitter Share Icon Telegram Share Icon WhatsApp Share Icon Reddit Share Icon Pinterest Share Icon