به منظور سریع تر شدن پروسه ی کد نویسی ابزار های مختلفی ساخته شده است، ویرایشگر ها یکی از انواع ابزار هایی هستند که به سرعت بخشیدن کار ما کمک می کنند. برخی از ویرایشگر های محبوبی که در حال حاضر در سراسر دنیا استفاده می شوند عبارتند از: VS code ، Sublime Text و ++NotePad. در درون این برنامه ها بسته هایی قرار دارد که با استفاده از آن ها می توانید به سفارشی سازی بپردازید یا یک قابلیت جدید به ویرایشگر خود اضافه کنید، این بسته ها را “افزونه” می گویند.
در این مقاله قصد دارم چند افزونه ی کاربردی از VS code را به شما معرفی کنم.
۱) Visual Studio IntelliCode
این افزونه جزو محبوب ترین هاست، با نصب این افزونه مشاهده خواهید کرد که هنگام نوشتن کد به شما پیشنهاد کد می دهد.
زبان هایی که از این افزونه پشتیبانی می کنند عبارتند از: پایتون، سی پلاس پلاس، جاوا اسکریپت و …
در واقع این افزونه با استفاده از تکنیک یادگیری ماشین (Machine Learning)، به بررسی هزاران کد منبع باز (Open Source) از گیت هاب می پردازد و سینتکس های مختلف را به هنگام کد نویسی پیشنهاد می دهد.
البته از قابلیت های دیگر این افزونه می توان به “تکمیل اتوماتیک کد” اشاره کرد.
Minify (2
این افزونه کد را کوتاه می کند و باعث کاهش حجم کد می شود.
بهتر است در آخر کار از این افزونه استفاده شود چرا که در بعضی از فایل ها ممکن است کدتان را تغییر دهد.
پس از استفاده از این قابلیت، فایل جدیدی با پسوند min. ساخته می شود.
این افزونه را می توان برای فایل های HTML,CSS و JavaScript نیز استفاده کرد.
۳) Open-In-Browser
نرم افزار VS code هیچ گزینه ای برای بازکردن فایل ها در مرورگر به صورت مستقیم ندارد. در این میان این ابزار مفید، خودش را نشان می دهد، پس از نصب این افزونه، گزینه ی Open With Default Browser را درون منوی های contextual می توانید مشاهده کنید. برای باز شدن منو های contextual روی فایل مورد نظر کلیک راست کنید.
این افزونه قابلیت انتخاب مرورگر را در command palette قرار داده است.
۴) Path Intellisense
با نصب این افزونه دیگر نگران گم شدن نباشید.
از این ابزار برای آدرس دهی فایل ها استفاده می شود، به طوری که فقط کافیست درون Attribute مربوط به آدرس دهی، یک علامت اسلش (/) بگذارید، سپس خواهید دید که مسیر های پیش رو را برای شما نمایان خواهد کرد.
۵) IntelliSense for CSS class names in HTML
این افزونه از محبوبیت بالایی برخوردار است، با استفاده از این افزونه، قابلیت تکمیل خودکار نام کلاس ها به VS code اضافه می شود. همچنین می توانید نام کلاس هایی که درون فایل CSS، در صفحه ی جاری لینک داده شده اند را مشاهده کنید.
نکته ی قابل توجه راجع به این ابزار، پشتیبانی گسترده از زبان های برنامه نویسی است.
Bracket Pair Colorizer (6
با استفاده از این افزونه محدوده ی کد شما مشخص خواهد شد.
این ابزار قلمرو عناصری چون تابع، حلقه، کلاس و … را با آکولاد های رنگی جفتی مشخص کرده و با خطوطی از اول تا آخر قلمرو آن عنصر را علامت گذاری می کند.
Live Server (7
این افزونه یک سرور مجازی در اختیار شما قرار می دهد.
شما میتوانید با استفاده از این ابزار قدرتمند، به صورت آنی نتیجه ی کد های خود را مشاهده کنید.
برای استفاده از این ابزار قدرتمند کافیست، روی عبارت “Go Live” که در انتهای صفحه در سمت راست، موجود است کلیک کنید.
Live Server از زبان های HTML, CSS و JavaScript پشتیبانی می کند.
Rainbow Brackets (8
با استفاده از این افزونه دیگر در گذاشتن پرانتز برای عناصر مختلف گیج نخواهید شد.
در واقع این ابزار با استفاده از رنگ کردن جفتی پرانتز ها، تشخیص آن ها را آسان تر می کند.
۹) Beautify
این افزونه بسیار محبوب است و قابلیت قالب بندی را به کد های HTML ،CSS ،JSON و JavaScript می دهد.
۱۰) Css Peak
با استفاده از این افزونه می توانید به صورت مستقیم از فایل HTML به فایل CSS بروید.
این ابزار را نصب و فعال کنید و وارد فایل HTML شوید، کلید Ctrl را نگه دارید و نشانگر ماوس را روی آدرس CSS ببرید، حال کلیک کنید، خواهید دید که به فایل CSS و محدوده کد کلاس مورد نظر منتقل می شوید.
1 دیدگاه. ارسال دیدگاه جدید
vscode یکی از IDEهای خیلی سبک و پر کاربردیه. و کلی افزونه که کارهارو ساده تر میکنن