مقالات

Visual Studio Code یک ویرایشگر کد (Source Code Editor) سبک اما قدرتمند است که روی کامپیوتر دسکتاپ اجرا می‌شود. این ویرایشگر کد برای ویندوز، MacOS و لینوکس در دسترس است. این برنامه با پشتیبانی توکار ( Built-in) از JavaScript ، TypeScript و Node.js ارائه می‌شود و دارای یک اکوسیستم غنی از افزونه‌هایی ( Add-on) برای زبان‌های دیگر (مانند C++ ،C# ،Java ، Python ، PHP و Go) و سیستم‌های زمان اجرا (مانند NET. و Unity) است.

ویرایشگر کد چیست؟

یک نرم‌افزار کامپیوتری از «کدهای منبع» ساخته شده است. این کدهای منبع معمولاً از طریق یک برنامه ویرایشگر کد منبع وارد کامپیوتر می‌شوند. این ویرایشگر یک «واسط برنامه‌نویسی» ( Programming Interface) است که کدهای نرم‌افزاری را دریافت و ذخیره می‌کند. در حوزه کدنویسی، ویرایشگرهای کد منبع مختلفی وجود دارد. اغلب، هر ویرایشگر برای یک زبان برنامه‌نویسی خاص نوشته می‌شود.

تفاوت ویرایشگر کد و محیط توسعه

بیشتر برنامه‌های کامپیوتری، در یک محیط توسعه یکپارچه ( IDE | Integrated Development Environment) ساخته می‌شوند. IDE معمولاً شامل یک برنامه ویرایشگر کد است که کد منبع یک برنامه را ضبط و تجمیع می‌کند. ویرایشگر کد می‌تواند بهره‌وری یک توسعه‌دهنده نرم‌افزار را افزایش دهد. زیرا، با استفاده از یک برنامه ویرایشگر کد منبع می‌توان بلافاصله اعتبار کدهای تولید شده را سنجید.

IDE محیطی است که چند قابلیت را با هم در یک برنامه واحد ترکیب می‌کند. بنابراین می‌توان تفاوت ویرایشگر کد و محیط توسعه را اینگونه بیان کرد:

یک ویرایشگر کد در واقع نوعی ویرایشگر متن است که ویژگی‌های افزوده مفیدی برای نوشتن کد ارائه می‌دهد، اما IDE معمولاً چیزی پیچیده‌تر است که چند ابزار مختلف را با هم ترکیب می‌کند.

قابلیت تکمیل خودکار در ویرایشگر کد

امکانات تکمیل کد به صورت خودکار (Auto-Code Complete) در اکثر برنامه‌های ویرایشگر کد منبع امروزی وجود دارد. ویژگی تکمیل خودکار کد به این صورت است که ویرایشگر یک کلمه یا عبارت را بر اساس آنچه برنامه‌نویس در ویرایشگر تایپ کرده است،‌ پیش‌بینی می‌کند. در واقع، قبل از اینکه برنامه‌نویس تایپ یک خط کد را به پایان برساند، ویرایشگر، کلمات کد را پیش‌بینی کرده و استفاده از آن‌ها را به برنامه‌نویس پیشنهاد می‌دهد.

امکانات Visual Studio Code

VS Code از مجموعه گسترده‌ای از زبان‌های برنامه‌نویسی شامل ++Java ،C و Python گرفته تا CSS ،Go و Dockerfile پشتیبانی می‌کند. علاوه بر این، VS Code به برنامه‌نویسان امکان می‌دهد تا افزونه‌های جدیدی از جمله Code Linterها (ابزارهای تحلیل کد برای عیب‌یابی)، اشکال‌زدایی و پشتیبانی از توسعه وب و فناوری ابری را اضافه و حتی ایجاد کنند. رابط کاربری VS Code در مقایسه با سایر ویرایشگرهای متن، امکان تعامل بیش‌تری را با برنامه‌نویس فراهم می‌کند. برای ساده‌سازی تجربه کاربری، VS Code به پنج ناحیه اصلی تقسیم می‌شود:

نوار فعالیت (activity bar)
نوار کناری (side bar)
گروه‌های ویرایشگر (Editor groups)
پنل (panel)
نوار وضعیت (status bar)
 

کاربردهای Visual Studio Code

اکثر افراد به درستی Visual Studio Code را به عنوان یک ویرایشگر کد و حتی یک محیط توسعه برای برنامه‌نویسی پروژه‌ها یا کار بر روی پرونده‌های متنی در نظر می‌گیرند. اما، انعطاف‌پذیری نهفته در VS Code در قالب افزونه‌ها به این ویرایشگر اجازه می‌دهد تا کارهای بسیار بیش‌تری علاوه‌بر پشتیبانی از زبان‌های برنامه‌نویسی یا قالب‌های فایل انجام دهند. افزون بر امکان کدنویسی،‌ VS Code می‌تواند از موارد کاربردی متعدد دیگری نیز پشتیبانی کند. در ادامه، چهار روش برای استفاده از VS Code با هدف بهبود سطح کیفی فرآیند توسعه و فراتر از یک ویرایشگر متن ساده، ارائه شده است.

ویژگی های کاربردی Visual Studio Code

ویرایشگر VS Code امکانات و ویژگی‌های بسیاری دارد که در این بخش از مطلب آموزش Visual Studio Code به برخی از آن‌ها اشاره شده است.

• * پشتیبانی چند‌ پلتفرمی:‌ 

VS Code در سیستم‌عامل‌های ویندوز، لینوکس و macOS در دسترس است و می‌توان آن را به سرعت روی پلتفرم دلخواه نصب کرد.

• * برجسته‌سازی نحو: 

یک توسعه‌دهنده، ممکن است به زبان‌های مختلفی مثل t- SQL ،PHP، دستورات AWS CLI، پایتون، PowerShell  و JavaScript کدنویسی کند. VS Code‌ می‌تواند نحو مختص به یک زبان برنامه‌نویسی را برجسته و مشخص کند (Syntax Highlighting). با VS Code، نیازی به استفاده از چندین پلتفرم برای هر زبان برنامه‌نویسی وجود ندارد.

* تورفتگی سطر اول کد: 

VS Code‌ از دندانه‌گذاری (تورفتگی | Indentation) کد برای زبان‌های برنامه‌نویسی مختلف نیز پشتیبانی می‌کند.

* افزونه‌ها: 

VS Code افزونه‌های ( Plug-in | Extensions) بسیاری برای بهبود کارایی ویرایشگر Visual Studio Code فراهم می‌کند. این افزونه‌ها قابلیت‌ها و توانایی‌های VS Code را افزایش می‌دهد. می‌توان از افزونه‌هایی برای SQL Server ،AWS ،Python و میانبرهای صفحه‌کلید در این ویرایشگر استفاده کرد.

* ارائه نمای درختی: 

ویرایشگر VS Code‌ یک نمای درختی یا واسط سلسله‌مراتبی برای دیدن فایل‌های پروژه ارائه می‌دهد که با استفاده از آن می‌توان به بخش‌های مختلف پروژه سرکشی کرد.

* خط فرمان یکپارچه: 

Visual Studio Code یک خط فرمان یکپارچه برای فضای کاری توسعه‌دهنده ارائه می‌دهد. نیازی به نقل مکان به پنجره‌های مختلف برای انجام کارهای مربوط به خط فرمان وجود ندارد.

* زبان نمایش داده شده: 

به راحتی می‌توان زبان دلخواه را در VS Code‌ با استفاده از افزونه مجموعه زبان، تنظیم کرد.

* تِم‌های رنگی: 

به راحتی می‌توان محیط ویرایشگر VS Code‌ را با طرح‌های رنگی مختلف شخصی‌سازی کرد. می‌توان به سرعت Themeرا مطابق سلیقه تغییر داد.

* امکانات توسعه وب: 

VS Code دارای پشتیبانی درونی برای توسعه Node.js با JavaScript و TypeScript است که از همان فناوری‌های تعبیه شده در محیط توسعه یکپارچه Visual Studio قدرت گرفته‌اند. همچنین، VS Code شامل ابزارهای عالی برای فناورهای وب همچون Less ،SCSS ،CSS ،HTML ،JSX/React و JSON است.

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

مزایای Visual Studio Code

Visual Studio Code در مقایسه با Visual Studio محصولی کاملاً متفاوت است. VS Code چند‌پلتفرمی است و با ویندوز، لینوکس و مک سازگاری دارد، در حالی‌که، Visual Studio تنها برای سیستم‌عامل ویندوز و مک ارائه می‌شود. در این بخش از آموزش Visual Studio Code، به مزایا و نقاط قوت این ویرایشگر کد قدرتمند و کاربردی پرداخته شده است.

قابلیت IntelliSense برای زبان برنامه‌نویسی

IntelliSense یک اصطلاح کلی است که برای اشاره به مجموعه‌ای از چند ویژگی و قابلیت که در ویرایش کد به کار می‌رود و توسط مایکروسافت ارائه شده است. این قابلیت‌ها در ادامه فهرست شده است.

• * تکمیل خودکار کدها (Code Completion)
  * اطلاعات پارامتر (Parameter Info)
  * اطلاعات سریع (Quick Info)
  * دستیاری محتوا (Content Assist)
  * سرنخ‌دهی کد (Code Hinting)

قابلیت‌های IntelliSense در VS Code برای زبان‌های برنامه‌نویسی JavaScript ،TypeScript ،JSON ،HTML ،CSS ،Less و Sass به صورت پیش‌فرض و از ابتدا موجود است. همچنین، می‌توان افزونه IntelliSense را برای سایر زبان‌های برنامه‌نویسی که پشتیبانی IntelliSense به صورت پیش‌فرض برای آن‌ها وجود ندارد، به VS Code اضافه کرد.

قابلیت Command Palette

VS Code از خط فرمانی داخلی به نام Command Palette (طیف دستورات) پشتیبانی می‌کند که موقعیت آن در مبدأ پروژه در حال اجرا قرار می‌گیرد. این ویژگی، کار را بسیار راحت می‌کند؛ زیرا، برنامه‌نویس ناچار نخواهد بود که وضعیت خط فرمان فعلی را برای اجرای یک دستور سریع خط فرمان، تغییر دهد. برای باز کردن این خط فرمان، می‌توان به سادگی از کلیدهای ترکیبی « Command/Control+Shift+P» استفاده کرد. 

این خط فرمان، یک PowerShell در داخل محیط توسعه VS Code به حساب می‌آید که آماده انجام وظایف معمول به صورت میانبر است. وقتی توسعه‌دهنده شروع می‌کند به تایپ کردن هر یک از این دستورات شناخته‌شده، Command Palette از IntelliSense help کمک می‌گیرد و حتی خط فرمان را آماده می‌کند تا وظایف مورد نظر کاربر را اجرا کند.

کنترل نسخه داخلی

Visual Studio Code به صورت داخلی دارای انضمام گیت ( Git) است. این قابلیت کار توسعه‌دهندگان را در ملاحظه و بررسی تغییراتی که در پروژه انجام می‌شود راحت می‌کند. از طریق زبانه مدیریت منبع در نوار فعالیت VS Code می‌توان گیت را راه‌اندازی کرده و بسیاری از دستورات Git از جمله commit ،pull ،push و rebase قابل اجرا است. همچنین، از طریق قابلیت کنترل نسخه داخلی، می‌توان تغییرات انجام شده در فایل‌های پروژه را نیز بررسی کرد. VS Code با هر نوع مخزن گیت، چه راه دور و چه محلی، کار می‌کند و برای رفع مغایرت‌ها قبل از Commit کردن کدها، از نمادهای بصری استفاده می‌کند.

امکانات اشکال‌زدایی

یکی از ویژگی‌های کلیدی Visual Studio Code، پشتیبانی قدرتمند آن برای اشکال‌زدایی (Debugging) است. Debugger درونی VS Code به سرعت بخشیدن در چرخه ویرایش، کامپایل و اشکال‌زدایی کدها کمک می‌کند. به صورت پیش‌فرض، VS Code از اشکال‌زدایی فریم‌ورک NodeJS پشتیبانی می‌کند و به طور کلی می‌تواند هر چیزی را که به جاوا اسکریپت ترجمه می‌شود، اشکال‌زدایی کند. اگرچه، برای اشکال‌زدایی سایر زبان‌های زمان اجرا ( Runtime) مثل ‎C++‎ یا پایتون، نیاز به نصب افزونه مخصوص وجود دارد.

امکان ویرایش چند فایل به صورت همزمان

گاهی لازم است برای ویرایش یک فایل از کدهای فایل دیگری استفاده شود. VS Code‌ امکان باز کردن چند ویرایشگر در کنار یکدیگر را فراهم می‌کند. برای استفاده از این ویژگی، می‌توان به سادگی روی فایل راست کلیک کرده و گزینه « Open to the slide» را انتخاب کرد.

ویژگی‌‌های مدیریت کد

VS Code‌ امکانات خدماتی برای زبان‌های برنامه‌نویسی مختلفی را در اختیار توسعه‌دهندگان قرار می‌دهد. برخی از این امکانات در ادامه فهرست شده‌اند:

• * Peek Definition: 

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

* Go to Definition: 

این ویژگی به‌نوعی از یک منبع یا عضو نقل مکان می‌کند و نتیجه را در یک زبانه جدید باز می‌کند.

* یافتن همه منابع: 

پنجره «Find All References» تمام رویدادهای یک نماد را پیدا می‌کند. در صورتی که منبع مربوطه قطعی نباشد، مثلاً بخشی از یک فراخوانی پویا باشد، آن رویداد به رنگ خاکستری درمی‌آید.

* نماد تغییر نام: 

تغییر نام یک عمل رایج مرتبط با بازسازی کد منبع است. VS Code یک نماد تغییر نام مجزا (F2) دارد.

این امکانات برای هر توسعه‌دهنده‌ای بسیار کاربردی محسوب می‌شوند. در VS Code، می‌توان قالب‌بندی کد جاوا اسکریپت و کدهای سایر زبان‌های برنامه‌نویسی را انجام داد. برای دسترسی به امکانات ذکر شده در بالا، می‌توان در داخل فایل کدها راست کلیک کرد. VS Code‌ ویرایشگر محبوب و پراستفاده‌ای است و مزایای بسیاری دارد که در این بخش تنها به برخی از آن‌ها اشاره شد. در ادامه مطلب آموزش Visual Studio Code به برخی از معایب و کاستی‌های این ویرایشگر کد اشاره شده است.