Fadak.IR راهکارهای فدک
English Русский العربية فارسی
مقالات مدیریت مطالعات زبان


/ فاوا / برنامه نویسی

افزونه‌ی و پلاگین VS Code


      مقدمه
         Visual Studio Code
         تفاوت IDE‌ها و ویرایشگرها (code editor)
         نصب افزونه در ویژال استودیو کد
          Visual Studio Marketplace
          Visual Studio Intellicode
         Git Blame
         Prettier
         JavaScript Booster
         JavaScript (ES6) Code Snippets
         Sass
          Path Intellisense
       برای توسعه دهندگان بک‌اند Back End
         PHP Intelephense
         PHP Debug
         DocBlocker
         Path Intellisense
         Bracket Pair Colorizer
       برای توسعه دهندگان فرانت‌اند Front End
         Live Preview
         Settings Sync
         Shopify Liquid Template Snippets
          Trailing Spaces
         Blank Line at the End of File
         Liquid
          GitLens
         Path Intellisense
         IntelliSense for CSS class names
          Css Peek
         Guides
         Debugger for Chrome
         open in browser
      قالب‌ها و سرگرمی 🌈
         One Dark Pro
         Rainbow Brackets
         Indent Rainbow
         Atom-inspired themes
      برترین IDE  برای برنامه نویسی

مقدمه

Visual Studio Code

ویژوال استودیو کد یک ویرایشگر کد متن باز برای لینوکس، مک و ویندوز است که از زبان‌های PHP، JavaScript، ASP.NET و Java و بسیاری از زبان‌های دیگر پشتیبانی می‌کند. vscode قابلیت شخصی سازی بالایی دارد که باعث شده صدها افزونه (extension) زبان‌های برنامه نویسی مانند سی پلاس پلاس، سی شارپ، جاوا، پایتون، PHP و…. ساخته شود. VSCode یک code editor است اما برخی از افراد تصور می‌کنند که یک IDE هست.

تفاوت IDE‌ها و ویرایشگرها (code editor)

IDE‌ها (Intergrated Development Enviroment) یا محیط توسعه یکپارچه نرم افزار‌های کاملی هستند که امکاناتی مثل Debugger، Auto Complete، Highlighting و ابزار اجرا و خروجی گرفتن و… را دارند و بدون نیاز به نصب هیچ پلاگینی، کامل هستند. هر IDE معمولا مختص و مخصوص یک زبان برنامه نویسی است و تمرکز تمامی ابزار‌ها و امکانات بر روی یک زبان است.
اما ویرایشگرها (code editor) معمولا تعداد بسیار بالایی از زبان‌های برنامه نویسی را پشتیبانی می‌کنند و نسبت به IDE‌ها سبکتر و سریع تر هستند و هرنوع کدی را تشخیص میدهند. ویرایشگر‌ها تمام ابزار‌ها را ندارند و برای داشتن قابلیت‌های  مختلف باید افزونه‌های مختلفی را نصب کرد.

نصب افزونه در ویژال استودیو کد

جستجو و نصب افزونه‌های کار بسیار ساده‌ای است. اگر سیستم عامل شما مک است از دکمه‌های ترکیبی cmd + shift + x و برای ویندوز از دکمه‌های ctrl + shift + p استفاده کنید و یا شما می‌توانید روی آیکون Extensions که در نوار Activity در سمت چپ ویژوال استودیو می‌باشد کلیک کنید تا پنل  Extensions برای شما نمایش داده شود، بعد از انتخاب افزونه روی دکمه Install کلیک کنید تا افزونه شما نصب شود.
نصب افزونه در vscode
همچنین می‌توانید با فشردن دکمه‌های ترکیبی ctrl + shift + p در سیستم عامل ویندوز و cmd + shift + p در  OSX از Command Palette عبارت Install extensions را تایپ کنید تا پنل Extensions برای شما نمایش  داده شود.

 Visual Studio Marketplace

مکانی برای دریافت و خرید افزونه‌های برای ویژوال استیو کود

 Visual Studio Intellicode

این افزونه به برنامه نویس‌ها ویژگی “کامل کردن اتوماتیک کد” رو ارائه میده و خیلی جاها با پیشنهادات بدرد بخورش بهتون کمک میکنه و خوبیش اینه که زبان‌های زیادی رو هم پشتیبانی میکنه: از پایتون و C++ گرفته، تا جاوااسکریپت
اما بخش هیجان انگیز این پلاگین، اینه که از یادگیری ماشینی استفاده میکند! Visual Studio Intellicode با بررسی و اسکن هزار پروژه “منبع باز” (open-source) توی گیت‌هاب، الگوهای مختلف کد نویسی رو پیدا میکند
VS Code Plugin - پلاگین

Git Blame

هر از گاهی، مخصوصا توی کارای تیمی، احتیاج میشه که بدونید چه کسی و چه زمانی فلان بخش از کد رو نوشته یا تغییر داده. سیستم‌هایی مثل گیت و گیت‌هاب میتونن این ویژگی رو در اختیارتون بذار، اما وقتی با VS Code کار میکنید، نیازی نیست برای فهمیدن این اطلاعات، جای دوری برید.
پلاگین Git Blame بهتون میگه که آخرین بار، کدوم تغییر توسط کدوم یکی از اعضای تیم اعمال شده و کدوم commit تغییرات رو اعمال کرده. فقط کافیه که روی اون خط از کد کلیک کنید!
VS Code Plugin - پلاگین

Prettier

تمیز و خوانا بودن کدها. باعث کار اصلاح و ویرایش کدها راحت تر انجام شود. هم اینکه وقتی یه شخص یا گروه دیگه بخواد روی کدی که نوشتین کار کنه، پوستش پاره نمیشه!
پلاگین Prettier این کار رو به راحتی براتون انجام میده. اینجوری،‌ حداقل خود من موقع نوشتن دیگه نیاز نیست خیلی به نظم و انضباط کدها دقت کنم و به ترتیبی که توی ذهنم دارم اونا رو می‌نویسم و در نهایت، این افزونه با زدن دوتا دکمه یا حتی موقع ذخیره کردن،‌ کار مرتب سازی رو انجام میده.
البته هممون میدونیم که یه پلاگین، هر چقدر هم که قدرتمند باشه،‌ بازم نمیتونه یه فاجعه رو به معجزه تبدیل کنه! پس در قدم اول، خود ماها باید توی نوشتن کدها دقت داشته باشیم و در نهایت، خوشگل کردنش رو به این افزونه بسپاریم!
پلاگین Prettier خیلیاز زبان‌های مورد استفاده توسط توسعه دهنده‌های وب رو پشتیبانی میکنه،‌مثل این موارد: HTML – CSS – JavaScript – TypeScript – GraphQL – ReactJS و…

JavaScript Booster

یسبسی

JavaScript (ES6) Code Snippets

تمام توسعه دهنده‌های وب،‌ احتمالا یه بار گذرشون به جاوااسکریپت و کتابخونه‌ها و فریم ورک‌های متعددش افتاده (برنامه نویس‌های فرانت‌اند که رسما باهاش زندگی میکنن) الانم با توجه به روی بورس بودن جاوااسکریپت ورژن ۶ (ES6)،‌باید حتما بتونید با این ورژن کار کنید.
پلاگین JavaScript (ES6) Code Snippets با استفاده از امکاناتی که داره، میتونه خیلی روی سرعت و دقت شما تاثیر بذاره و با قطعه کد‌های آماده‌ای که داره، بخش‌های زیادی از برنامه شما رو تکمیل میکنه و همین قضیه،‌ حداقل ریسک غلط‌های تایپی رو کمتر میکنه! (و قطعا سرعت رو هم بالا می‌بره)
VS Code Plugin - پلاگین ES6

Sass

این پلاگین بیشتر بدرد برنامه نویس‌های فرانت‌اند میخوره و همونطور که از اسمش هم مشخصه،‌ توی نوشتن استایل‌ها با پیش پردازنده Sass به کارتون میاد.
این افزونه،‌ با تکمیل کردن خودکار و تصحیح Syntax کد، باعث میشه که بتونین روی خود کد و هدفی که دارید تمرکز کنید و درگیر جزئیات ریز و وقت گیر نشید.
البته یه افزونه دیگه هم وجود داره که میتونه این یکی رو تکمیل کنه:‌ Live Sass! با استفاده از این یکی هم میتونید به راحتی توی محیط VS Code فایل‌های استایل رو که با استفاده از پیش پردازنده نوشتید،‌ اجرا کنید. (قبلا یه دوره برای آموزش Sass نوشتم توی سایت که میتونید استفاده کنید.)

 Path Intellisense

یکی دیگه از افزونه‌های مورد علاقه من! وقتی که دارید با تعداد زیادی فایل کار میکنید که قراره به هم متصل بشن، نوشتن و پیدا کردن آدرس هر فایل، تبدیل به یه کار وقت گیر میشه. (این اتفاقات مخصوصا توی ری اکت زیاد می‌افته، چون اونجا توی اکثر پروژه‌ها با تعداد زیادی Component سر و کله میزنیم)
پلاگین Path Intellisense کمک میکنه که خیلی سریع آدرس فایل‌های دیگه رو توی کدتون وارد کنید و از بخش Import کردن خیلی سریع رد بشید.
توی نگاه اول،‌ این وظیفه خیلی ساده به نظر میرسه و حتی خود ادیتور هم به صورت ابتدایی تر انجامش میده. اما تجربه نشون داده که به مرور، سرعت و دقت کارتون رو افزایش میده و حسابی بهش وابسته میشین!
VS Code Plugin - پلاگین
۷. Debugger for Chrome
وقتایی که با جاوااسکریپت کار میکنید، احتمالا خیلی پیش میاد که مدام به مرورگرتون سر بزنید تا ارورهای کد رو بگیرید و اون رو دیباگ کنید.
افزونه Debugger for Chrome که توسط خود شرکت مایکروسافت (سازنده VS Code) طراحی شده، محیط دیباگر کروم رو توی خود ادیتور بهتون ارائه میده و همونجا میتونید همه کارا رو انجام بدید.
اینجوری، دیگه نیاز نیست مدام بین مرورگر و ادیتور جابجا بشید. (توی پرانتز باید اعلام کنم که مرورگر مورد علاقه خود من، اپراست ^ـ^)
VS Code Plugin - پلاگین
۸. ESLint
این پلاگین برای پیدا کردن باگ‌های کد عالی عمل میکنه. ESLint با آنالیز کردن کد،‌ ایرادها رو پیدا میکنه و کمک میکنه اونا رو راحت تر رفع کنید و نقطه قوتش اینه که توانایی درک سینتکس رو هم داره، بنابراین میتونید توی رفع ارورهای سینتکسی هم ازش استفاده کنید.
ویژگی مثبت دیگه‌ای که این پلاگین داره،‌ امکان شخصی سازی اونه که میتونید با توجه به خواست و نیازتون، تغییرش بدین!
VS Code Plugin - پلاگین ESLint
۹. SVG Viewer
استفاده از فرمت SVG توی تکنولوژی وب داره فراگیر میشه و خب امکانات زیادی هم برای دولوپرها فراهم میکنه. بخاطر همین، VS Code از طریق این افزونه،‌تصمیم گرفته که به شما اجازه نمایش فایل‌های SVG رو بده!
به این ترتیب،‌ میتونید با استفاده از خود ادیتور،‌ فایل‌هاتون رو باز کنید و دیگه نیاز نباشه محیط ویرایشگر ور ترک کنین. خبر خوب دیگه اینه که با استفاده از این افزونه،‌ میتونید از فایل‌ها بصورت PNG هم خروجی بگیرید.
VS Code Plugin - پلاگین SVG
۱۰. پوسته‌ها و تم‌ها
تم تیره بین برنامه نویسا به شکل ترسناکی محبوبه (برای خود منم همینطور! البته یکی دو بار سعی کردم تم روشن و سفید رو امتحان کنم ولی خیلی ارتباط برقرار نکردم :/ )
اما در هر صورت، از اونجایی که ما ساعت‌های زیادی رو توی محیط ویرایشگر میگذرونیم، داشتن یه تم خوشگل میتونه خیلی حالمون رو بهتر کنه.
خوشبختانه گزینه‌های رایگان زیادی برای خوشگلتر کردن VS Code وجود داره که میتونید از مارکت ویژوال استودیو اونا رو دانلود کنید و لذت ببرید. مثل:‌ One Monokai –  One Dark Pro – Material Icon – و …
نکته مهمی که میخوام توی آخر این مطلب بهش اشاره کنم، اینه که استفاده از پلاگین‌ها توی شروع برنامه نویسی،‌ چندان کار درستی نیست. چون باعث میشه که ما به استفاده ازشون عادت کنیم و دیگه نفهمیم که نرم افزار چطوری کار میکنه.
به عبارت بهتر،‌ دیگه ما زبون کامپیوترمون رو درست نمیفهمیم و این برای یه برنامه نویس چندان جالب نیست.
ما هر چقدر که عمیقتر ماشین‌ها و کامپیوتر‌ها رو بفهمیم، به توانایی‌ها و محدودیت‌هاشون بیشتر پی می‌بریم و میتونیم کارای بزرگتر و بهتری انجام بدیم!
بهترین راه این هست که کد خودتون روی لوکال بنویسید اجرا کنید بعد از اینکه مطمئن شدید مشکلی نداره روی‌هاست آپلود کنید.
پلاگین زیر وجود داره برای vscode میتونید استفاده کنید :
https://github.com/liximomo/vscode-sftp

 برای توسعه دهندگان بک‌اند Back End

PHP Intelephense

     افزونه‌ی PHP Intelephense که کار با PHP را برای ما خیلی آسان می‌کند.

PHP Debug

    افزونه‌ی PHP Debug برای خطایابی کدهای PHP استفاده می‌شود.

DocBlocker

    افزونه‌ی DocBlocker که برای گذاشتن مستندات کدهایمان بسیار پرکاربرد است.

Path Intellisense

    افزونه‌ی Path Intellisense برای دستیابی راحت فایل‌ها و پوشه‌هایی که در کنار پروژه‌هایمان هستند.

Bracket Pair Colorizer

    افزونه‌ی Bracket Pair Colorizer برای رنگ بندی براکت‌ها که با { } شناخته می‌شوند تا بتوانیم براکت‌های مختلف دستورات و حلقه و … را راحت‌تر تشخیص بدهیم.

 برای توسعه دهندگان فرانت‌اند Front End

امکان جستجو در ویژال استودیو و همچنین VS Code Extension Marketplace میسر است.

Live Preview

سشیس

Settings Sync

این اکستشن یکی از مهمترین افزونه‌هاست قبلا با نام Visual Studio Code Settings Sync شناخته می‌شد، برای همگام سازی تنطیمات، اسنیپست‌ها، قالب‌ها، کلیدهای میانبر، فضاهای کاری، اکستنشن‌ها و… را در میان دستگاه‌های مختلف استفاده می‌شود و می‌توانید همه ابزارهایی که به آنها نیاز دارید را یکجا داشته باشید.
معرفی افزونه‌های vscode
اسنیپست و سبک کد
اسنیپست‌ها بسیار ساده هستند تعداد زیادی اسنیپست‌ها به‌صورت پیش‌فرض در vscode وجود دارند. برای فعال کردن اسنیپست‌ها کافی است دکمه‌های ترکیبی Ctrl + Space را همزمان فشار دهید تا پالت فرمان (Command Palette) به همراه پیشنهادات برای شما نمایش داده شود.
شما میتوانید در Command Palette عبارت Insert Snippet را تایپ کنید و یک اسنیپست را انتخاب کنید یا از طریق TextMate snippet syntax اسنیپست مورد نظر را ایجاد کنید. همچنین از طریق اکستشن‌ها میتوانید بارگیری کنید.در ادامه برخی از افزونه‌های اسنیپست‌ها را معرفی می‌کنیم.

Shopify Liquid Template Snippets

افزونه Shopify Liquid Snippets Snippets شامل اسنیپت‌های مختلف Liquid برای سرعت بخشیدن به توسعه قالب‌ها استفاده می‌شود.بعد از اینکه این افزونه را نصب کردید بخشی از کلید واژه اسنیپست را تایپ کنیدو Enter یا Return را بزنید و همچنین در سیستم عامل ویندوز و لینوکس با دکمه‌های ترکیبی ctrl + space و در OSX با cmd + space می‌توانید اسنیپست‌ها را فعال کنید.

 Trailing Spaces

افزونه Trailing Spaces دقیقاً همان کاری را که اسم توصیف می‌کند انجام می‌دهد، یعنی به شما این امکان را می‌دهد تا فضاهای انتهایی را برجسته کرده و به سرعت آنها را حذف کنید. این افزونه، یک پورت از پلاگین محبوب Sublime Text Trailing Spaces است و حذف سریع فضاهای انتهایی، اصلاح و ذخیره و موارد دیگر را انجام می‌دهد.

Blank Line at the End of File

یک افزونه بسیار کوچک و فوق العاده ساده است که در انتهای هر فایل ذخیره شده یک خط خالی اضافی، به آن اضافه می‌کند.

سینتکس و لینتر‌های‌هایلایت کننده

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

Liquid

افزونه Liquid برای کسانی که با استفاده از VS Code تم‌های Shopify را توسعه می‌دهند، ضروری است. اگرچه از آیکون‌های نوار کناری برای تمیز کردن پرونده‌های آماده Liquid پشتیبانی می‌شود، VS Code بدون کمک این افزونه برجسته سازی نحوی را برای Liquid ندارد. این افزونه برجسته سازی نحوی را برای Liquid اضافه می‌کند و به عنوان پشتیبانی از افزونه Shopify Liquid Snippets عمل می‌کند. همچنین از بلوک‌های کد بخش و تکمیل خودکار قطعه برای برچسب‌ها و فیلترهای Liquid پشتیبانی می‌کند.
4 زبان برنامه نویسی که باید در سال 2021 یاد بگیرید
stylelint -6
stylelint افزونه‌ای است که CSS، SCSS و Less را لینت می‌کند. این افزونه را با پیکربندی تنظیمات میتوان طوری کنترل کرد که stylelint برای زبان‌های مختلف فعال یا غیر فعال باشد.
7- ESLint
افزونه ESLint را در vscode ادغام میکند ولی قبل از آن بهتر است بصورت محلی یا سراسری ESLint را روی سیستم خود نصب کنید. این کار را از طریق npm با استفاده از npm install -g eslint می‌توان انجام داد. ESLint  به برنامه نویس‌ها این امکان را می‌دهد که از اشتباهات مرسوم که در سینتکس برنامه‌ها رخ می‌دهد خودداری و جلوگیری کند. دستورالعمل و تنظیمات پیکربندی و نصب دقیقتر در صفحه بازار اکستشن ویژال استودیو کد وجود دارد.
8- TSLint
این نسخه جدید TSLint مشابه افزونه است، به این معنی که شما قبلاً TSLint را به صورت لوکال در یک پروژه یا به صورت گلوبال در رایانه خود نصب کرده اید. این افزونه TSLint را برای زبان TypeScript در VS Code ادغام می‌کند.
ادغام با گیت
ادغام ترمینال به طور خودکار با ویژال استودیو کد ارائه می‌شود، و انجام تغییرات بدون نیاز به ترک ویرایشگر را آسان تر کرده. کافیست از دکمه‌های ترکیبی ^ + را برای باز کردن ترمینال یکپارچه از داخل VS Code استفاده کنید.
برنامه نویس‌ها تغییراتی را که در کد خودشان را میدهند نیاز دارند که پیگیری کنند و برای این کار چه راهی بهتر از گیت است؟در اینجا یکی از مفید‌ترین اکستشن ویژال استودیو کد وجود دارد که به شما کمک می‌کندگیت به طور کامل در vscode ادغام شود.

 GitLens

این افزونه شما را قادر می‌سازد که کارهای مدیریتی در گیت را آسان میکند همچنین نویسندگی کد را در VS Code تجسم کنید. شما می‌توانید تاریخچه یک فایل را مرور کرده و جستجو کنید، در هر خط از کد می‌توان توضیحات گیت آن را دید و حتی توضیحات شناور را تغییر داد (Diff) و تمام گزینه‌ها قابلیت شخصی سازی را دارند.

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

Path Intellisense

افزونه Path Intellisense برای تکمیل خودکار نام فایل بکار می‌رود.این افزونه هنگامی که مسیرها را زبان نشانه‌گذاری می‌نویسیم و همچنین در هر فایلی که نیاز به ارجاع مسیر وجود دارد مفید است.

IntelliSense for CSS class names

اکستنشن IntelliSense for CSS class names به تکمیل کردن خودکار نام کلاس‌ها برای خصوصیت کلاس HTML با بررسی تعاریف کلاس CSS در فضای کاری و فایل‌های خارجی ارجاع یافته در اجزای link کمک می‌کند.

 Css Peek

شما میتوانید با نصب این افزونه روی selectorدر html کلیک راست کرده و گزینه‌ی Go to Definition and Peek definition را انتخاب کنید. سپس شما را به مکان تعریف class و idهای css درفایل استایل شیت میبرد. با نصب این افزونه دیگر نیازی نیست بین فایل‌های html , css جابه جا بشم.

Guides

افزونه Guides برای تو  رفتگی در ویرایشگر کد استفاده می‌شود که از تو رفتگی خود ویژال استودیو متفاوت است. امکاناتی مانند راهنمای تورفتگی پشته و فعال، پس زمینه‌های تو رفتگی را دارد  که میتوانیم رنگ و سبک را شخصی سازی کینم.

Debugger for Chrome

این افزونه ابزاری برای همگام کردن دیباگر مربوط به کروم و دیباگر ویژوال استدیو کد است.با استفاده از url میتوانیم به vscode بگوییم که کدام url در کروم اجرا شود.
Instant Markdown -15
افزونه Instant Markdown به شما امکان می‌دهد اسناد Markdown را در VS Code ویرایش کرده و بلافاصله پیش نمایش آنها را در مرورگر خودتان مشاهده کنید. برای ویرایش فایل‌های readme و سایر اسناد نوشته شده در Markdown بسیار مفید است.

open in browser

ویژال استودیو کد گزینه‌ای برای باز کردن مستقیم فایل‌ها در مرور گر را نشان نمیدهد اما با نصب این افزونه امکان مشاهده یک فایل html را در مرور گر پیش فرض سیستم را خواهیم داشت. شما می‌توانید با راست کلیک کردن گزینه ” open in other browsers ” یا از command palette مرور گر مورد نظرتان برای باز شدن انتخاب کنید.

قالب‌ها و سرگرمی 🌈

One Dark Pro

    برای اینکه محیط ویرایشگرمان خیلی چشم نوازتر باشد از افزونه‌ی One Dark Pro استفاده می‌کنیم.

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

Rainbow Brackets

این افزونه رنگ‌های رنگین کمان را به براکت‌ها، پرانتز‌ها و آکولاد‌ها اضافه می‌کند و برای کسانی که با جاوااسکریپت کار میکنند افزونه محبوبی است.

Indent Rainbow

Indent Rainbow یک افزونه ساده است که تورفتگی‌های قبل کد شما را رنگ می‌کند و در هر مرحله رنگ‌ها عوض می‌شوند. اگر کد را برای Python یا Nim می‌نویسید برای آسانتر خواندن کد به این افزونه حتما نیاز خواهید داشت.

Atom-inspired themes

ممکن است vscode اولین ویرایشگری که از آن استفاده میکنید نباشد و قبل آز آن با ویرایشگر‌های دیگر کارکرده باشید. محبوب‌ترین قالب‌ها معمولاً آنهایی هستند که از ویرایشگرهای دیگر مانند Atom پورت شده‌اند. در اینجا 3 مورد از محبوب‌ترین تم‌هایویژال استودیو کد که از Atom پورت شده‌اند آورده ایم:
    Atom One Dark Theme
    Atom One Light Theme
    One Dark Pro

آموزش Visual Studio Code — از نصب تا اجرای اولین پروژه در VS Code – فرادرس - مجله‌

 

 

برترین IDE  برای برنامه نویسی

IDE چیست؟
IDE مخفف Integrated Developement Environment به فارسی محیط توسعه یکپارچه است. یکپارچه بودن به این معناست که تمامی ابزار‌هایی که برای توسعه نرم‌افزار مورد نظر خود را نیاز دارید، در قالب یک محیط جمع کرده و ارائه می‌دهد.
بنابراین IDE به طور کلی مجموعه‌ای ابزار‌ها هستند که در اختیار یک توسعه دهنده اپلیکیشن بصورت یکجا و کامل قرار می‌گیرد که بتواند به راحتی توسعه اپلیکیشن مورد نظر خود را امکان پذیر کند.
تفاوت IDE با Code Editor
بسیاری از برنامه‌نویسان تفاوت IDE با ویرایشگر کد را نمی‌دانند و حتی این دو را با هم اشتباه می‌گیرند. ویرایشگر کد همانطور که از اسمش پیداست، نرم‌افزاری است که برای ویرایش ساده کد مورد استفاده قرار می‌گیرد؛ در حالیکه IDE تمامی ابزار‌های مورد نظر از قبیل ویرایشگر کد، کامپایلر، دیباگر و... را در یک رابط کاربری گرافیکی (GUI) در اختیار توسعه دهندگان قرار می‌دهد.
در گذشته ویرایشگر کد Notepad++ بسیار کاربردی، کم حجم و سریع بود اما امروزه ویرایشگری مانند VSCode بسیار کم حجم، با GUI بسیار جذاب و پر از پلاگین‌های کاربردی، توسعه را برای برنامه‌نویسان و به خصوص برنامه‌نویسان وب ساده کرده است.
به طور خلاصه، ویرایشگر کد کامل نیست ولی مزیت آن این است که سرعت اجرای زیادی دارد و همچنین به حافظه و پردازش بسیار کمتری نیاز دارد.
معرفی بهترین IDE برای برنامه‌نویسی
انتخاب یک IDE خوب برای شروع برنامه‌نویسی و توسعه نرم‌افزار مورد نظرمان بسیار مهم است. اینکه از چه ابزاری استفاده می‌کنید، می‌تواند تاثیر زیادی در سرعت برنامه‌نویسی و کیفیت آن داشته باشد. برای همین بهتر است که قبل از شروع برنامه‌نویسی، با ابزار‌هایی که هم اکنون طرفداران زیادی دارند و جامعه برنامه‌نویسان تمایل به استفاده از آن‌ها دارند، آشنا شویم.
ما در اینجا 8 IDE معروف را مورد بررسی قرار داده‌ایم که از نظر ما بهترین IDE برای برنامه‌نویسی و توسعه اپلیکیشن می‌باشند. عمده IDE‌هایی که در اینجا معرفی می‌کنیم، مبتنی بر IntelliJ هستند و شرکت توسعه دهنده آن Jetbrains می‌باشد.
انتخاب بهترین IDE برای برنامه‌نویسی
1. IntelliJ IDEA (بهترین IDE برای جاوا و کاتلین)
اینتلی‌جی آیدیا بهترین IDE برای جاوا و کاتلین است. اگر به دنبال ساخت نرم‌افزار و اجرای آن بر روی JVM (ماشین مجازی جاوا)، احتمالا این بهترین گزینه شما خواهد بود. همچنین می‌توانید مستقیما پروژه‌هایی بر اساس فریمورک‌های Spring، Ktor، Quarkas و... بسازید.
اگر به زبان برنامه‌نویسی کاتلین علاقه دارید، این IDE به صورت کامل از این زبان پشتیبانی می‌کند و می‌توان اپلیکیشن‌های اندروید، iOS، وب، دسکتاپ و... را به کمک این زبان توسعه دهید.
ویژگی‌های IntelliJ IDEA
- پشتیبانی کامل از زبان برنامه‌نویسی کاتلین
- پشتیبانی کامل از زبان برنامه‌نویسی جاوا
- تکمیل هوشمند کد‌ها
- قابلیت دیدن جزئیات تاریخچه تغییرات کد‌ها (Local History)
- ابزار جستجوی هوشمند میان فایل‌ها و کد‌ها
- امکان برنامه‌نویسی برای Android، iOS، Desktop، Web و...
- پشتیبانی از توسعه UI به کمک Compose Multiplatform
- پشتیبانی از React، Node.js و...
- پشتیبانی از فریمورک‌های Spring، Ktor، Quarkas و...
- پشتیبانی از SQL
2. Android Studio (بهترین IDE برای اندروید و فلاتر)
اگر شما هم به دنبال توسعه اپلیکیشن برای اندروید هستید، حتما می‌دانید که در کنار IntelliJ IDEA، اندروید استودیو مهمترین ابزار توسعه اپلیکیشن‌های اندروید است. این IDE توسط گوگل توسعه داده شده است ولی مبتنی بر IntelliJ است یعنی هسته ابزار توسط Jetbrains توسعه داده شده است و توسط گوگل در حال توسعه است.
به کمک این ابزار می‌توانید به زبان‌های مختلف از جمله کاتلین و جاوا کد بنویسید و خروجی اندروید دریافت کنید.
همچنین به کمک SDK کاتلین مولتی پلتفرم موبایل که توسط جت برینز و گوگل توسعه داده شده است، به صورت همزمان خروجی اندروید و iOS را به زبان کاتلین دریافت کنید.
ویژگی‌های Android Studio
- دارای شبیه ساز (Emulator) داخلی گوشی‌های اندروید (مانند گوگل پیکسل)
- امکان افزایش امنیت اپلیکیشن به کمک Proguard
- پشتیبانی کامل از فریمورک فلاتر
- پشتیبانی از Kotlin Multiplatform Mobile برای دریافت خروجی اندروید و iOS
- امکان نصب Android SDK بصورت خودکار
- قابلیت تولید اپلیکیشن برای انواع پلتفرم (موبایل، تبلت، ساعت هوشمند، تلوزیون، دسکتاپ و...)
3. Visual Studio Code یا VSCode (بهترین IDE برای وب و کم حجم)
یکی از دلایل موفقیت VSCode، رایگان و کم حجم بودن آن است. ویژوال استودیو کد را هم می‌توان یک IDE دید و هم یک ویرایشگر کد! VSCode در سال 2015 معرفی شد و با رشد چشمگیر علاقه‌مندان به آن، تا سال 2018 طبق آمار Stackoverflow محبوب‌ترین IDE در بین توسعه دهندگان شد. ویژوال استودیو کد یک محیط کاملا قابل شخصی سازی دارد و می‌توانید از قالب مورد علاقه خود برای IDE استفاده کنید.
وجود پلاگین‌های بسیار زیاد و کاربردی به همراه آپدیت‌های همیشگی، این IDE را تبدیل به محبوب‌ترین IDE دنیا کرده است.
VSCode بر خلاف IDE‌های توسعه داده شده توسط جت برینز، رایگان است و مصرف منابع سیستمی آن بسیار پایین‌تر است. این IDE توسط مایکروسافت توسعه داده شده است و یکی از محبوب‌ترین IDE‌های دنیاست. وی اس کد در بین توسعه دهندگان وب نیز بسیار پر‌طرفدار است و به این دلیل که معمولا کد‌های فرانت‌اند و بک‌اند نیاز به کامپایلر داخلی IDE ندارد، پس می‌توان حتی در جایگاه ویرایشگر کد حرفه‌ای از آن استفاده کرد.
ویژگی‌های Visual Studio Code (VSCode)
- رایگان
- کم حجم و مصرف منابع کم
- پشتیبانی از Git و ورژن کنترل
- تکمیل کد هوشمند
- اصلاح هوشمند کد به کمک Refactor
- مولتی پلتفرم (قابل اجرا بر روی ویندوز، لینوکس و مک او اس)
- پشتیبانی از بیش از 30 زبان دنیا (جاوا اسکریپت، پایتون، جاوا، کاتلین، HTML، CSS، PHP و...)
3. PHPStorm (بهترین IDE برای PHP)
زبان PHP هم از آن زبان‌های پر‌طرفدار در دنیای برنامه‌نویسی وب است. همانطور که می‌دانید، PHP در توسعه بک‌اند وب تاکنون بسیار موفق عمل کرده و با ظهور چارچوب‌های متنوع مانند فریمورک لاراول، به این محبوبیت افزوده شد. برای اینکه بتوانیم به صورت حرفه‌ای برنامه‌نویسی PHP را انجام دهیم، قطعا نیاز به یک فریمورک قوی داریم که سازگاری زیادی نیز با فریمورک‌های معروف مانند Symphony و Laravel داشته باشد.
برای چنین نیازی، پی اچ پی استورم معرفی شده است. این IDE مخصوصا برای کدنویسی به زبان PHP ساخته شده است اما برای یک فول استک دولوپر همه ابزار‌های مورد نیاز را دارد و بنابراین برای فرانت‌اند نیازی به IDE دیگری نخواهید داشت. پی اچ پی استورم نیز بر مبنای IntelliJ توسعه داده شده است.
ویژگی‌های PHPStorm
- پشتیبانی و سازگاری کامل با فریمورک‌های معروف PHP
- پشتیبانی از Composer
- پشتیبانی از زبان‌های جاوا اسکریپت، SQL، HTML، CSS، SASS
- پشتیبانی از فریمورک‌های جاوا اسکریپت (React.js و Vue.js)
- پشتیبانی از PHP Doc
- پشتیبانی از ورژن کنترل (Git، Space و...)
- تکمیل خودکار کد‌های PHP
4. Pycharm (بهترین IDE برای پایتون Python)
بسیاری از برنامه‌نویسان علاقه‌مند به یادگیری زبان Python هستند. برای این زبان نیز IDE‌های متفاوتی وجود دارد اما بهترین محیط توسعه نرم افزار معرفی شده برای پایتون تاکنون، به قطع پایچارم بوده است. این IDE نیز توسط جت برینز توسعه داده شده است و مبتنی بر انجین IntelliJ ساخته شده است. این ابزار از فریمورک‌ها و تکنولوژی‌هایی مانند Django، Flask، Pyramid web2py پشتیبانی می‌کند.
همچنین این IDE پشتیبانی کاملی از زبان‌های جاوا اسکریپت، TypeScript، CoffeScript، HTML و CSS دارد. این ابزار پلاگین‌های زیادی برای برنامه‌نویسی با زبان پایتون در اختیار شما قرار می‌دهد. پس در نوع خود بهترین است.
ویژگی‌های Pycharm
- پشتیبانی کامل از زبان پایتون
- پشتیبانی از زبان‌های جاوا اسکریپت، تایپ اسکریپت، CoffeScript،HTML و...
- پشتیبانی از Node.js، AngularJs و React.js
- پشتیبانی کامل از ورژن کنترل‌ها (گیت و Space)
- پشتیبانی کامل از فریمورک جنگو (Django)
- خطایابی هوشمند در زمان کدنویسی
- امکان اصلاح هوشمند کد‍‌ها
5. Xcode (بهترین IDE برای iOS و MacOS)
توسعه دهندگان پلتفرم‌های اپل نیز به یک IDE مناسب برای برنامه‌نویسی به زبان Swift و Objective-C نیاز دارند. کمپانی اپل نیز برای این منظور IDE مخصوص خود را با نام XCode برای توسعه دهندگان قرار داده است. به کمک این IDE می‌توان برای همه انواع دستگاه‌های اپل که با سیستم عامل iOS یا MacOS کار می‌کنند، اپلیکیشن ساخت. برای مثال می‌توانید به کمک این IDE برای آیفون، اپل تی وی و اپل واچ اپلیکیشن توسعه داد.
محیط توسعه XCode بسیار جذاب و انعطاف پذیر است و به آن علاقه‌مند خواهید شد. رابط کاربری گرافیکی (GUI) این ابزار بسیار دلنشین است و می‌تواند در افزایش میزان جذابیت برنامه‌نویسی به زبان Swift تاثیر زیادی داشته باشد.
ویژگی‌های کلیدی XCode
- پشتیبانی از زبان‌های Swift، Python، Ruby، Objective-C، Java، C++ و C
- رابط کاربری گرافیکی (GUI) جذاب و کاربرپسند
- پشتیبانی از پلاگین‌های متعدد
- امکان برنامه‌نویسی برای دستگاه‌های موبایل، تبلت، دسکتاپ، واچ و تلوزیون اپل
- قابلیت شخصی‌سازی و استفاده از تم‌های مختلف
6. AppCode (یکی از بهترین IDE‌ها برای iOS و MacOS)
حال که با XCode آشنا شده‌اید، بد نیست روش جت برینز را نیز برای توسعه اپلیکیشن‌های iOS و MacOS را بررسی کنیم. AppCode نام IDE مبتنی بر اینتلیجی برای محصولات اپل است. دلایلی وجود داشته است که این غول سازنده IDE‌های مدرن دست به ساخت یک IDE برای رقابت با XCode زده است.
AppCode از زبان‌های متعدد پشتیبانی می‌کند و از قدرت انجین IntelliJ بهره‌مند شده است.
ویژگی‌های AppCode
- ویرایشگر هوشمند با قابلیت تشخیص خطا‌ها و ناوبری بهتر در پروژه
- تکمیل کد اتوماتیک بصورت هوشمند
- امکان اصلاح کد‌ها و فایل‌ها به صورت هوشمند با قابلیت Refactor
- پشتیبانی از زبان‌های متعدد مانند Swift، C، C++، Javascript، HTML، CSS و XPath
- پشتیبانی از SDK کاتلین مولتی پلتفرم موبایل (KMM)
- و...
7. WebStorm (بهترین IDE برای جاوا اسکریپت و فرانت‌اند)
اگر پایه برنامه‌نویسی شما جاوا اسکریپت است و یا یادگیری جاوا اسکریپت برای توسعه اپلیکیشن فرانت‌اند و بک‌اند را دارید، این IDE برای شما ساخته شده است. وب استورم قابلیت کنترل نسخه، تکمیل کد هوشمند، سازگاری کامل با فریمورک‌های جاوا اسکریپت مانند ری‌اکت و Vue.js و همچنین پشتیبانی کامل از Node.js را داراست.
Webstorm یکی از بهترین و رایج‌ترین IDE‌ها در بین توسعه دهندگان وب است که از محبوبیت بالایی برخورد دار است. این IDE نیز مبتنی بر IntelliJ و محصول جت برینز است.
ویژگی‌های Webstorm
- قابلیت تکمیل هوشمند کد
- پشتیبانی کامل از زبان جاوا اسکریپت
- پشتیبانی از React.js، Vue.js، Node.js، SQL، Sass Stylus، Typescript، Angular.js، LESS
- پشتیبانی از Refactor و اصلاح هوشمند کد‌ها و فایل‌ها
8. Fleet IDE (بهترین IDE مبتنی بر IntelliJ و نسل بعدی IDE‌های جت برینز)
Fleet IDE یکی از IDE‌های دیگر جت برینز است که با هدف رقابت با VSCode توسعه داده شده است. هدف از ایجاد این IDE، ساخت یک محیط توسعه نرم‌افزار مبتنی بر انجین IntelliJ، کم حجم و پر‌سرعت با یک رابط کاربری جدید معرفی شده است. این IDE هنوز در دست ساخت است و به صورت رسمی منتشر نشده است.
دلیل معرفی آن در این لیست این است که احتمالا باید شاهد کاهش محبوبیت Visual Studio Code باشیم زیرا Fleet تمام قابلیت‌های کلیدی ویژوال استودیو کد را در خود خواهد داشت و علاوه بر آن، قابلیت‌های کللیدی پلتفرم IntelliJ را نیز در خود گنجانده است.
دلیل دیگر معرفی آن، کم حجم بودن، سرعت بالا در اجرا و استفاده بسیار کم از منابع سیستمی در زمان اجرا می‌توان اشاره کرد. در جت برینز وجود یک IDE با قابلیت رقابت با VSCode بسیار خالی بود. حال باید منتظر انتشار یک IDE قدرتمند توسط جت برینز باشیم.
می‌توانیم Fleet IDE را بهترین IDE برای C++ نیز معرفی کنیم.
ویژگی‌های کلیدی Fleet:
- کم حجم و استفاده منابع سیستمی مناسب
- سرعت بالا در اجرا
- پشتیبانی از مدیریت ورژن و گیت
- پشتیبانی از Space
- پشتیبانی از زبان‌های مختلف (پایتون، کاتلین، جاوا، جاوا اسکریپت، تایپ اسکریپت، HTML، CSS، Go، PHP، سی پلاس پلاس و...)
- مولتی پلتفرم (قابلیت اجرا بر روی ویندوز، لینوکس و مک او اس)
- وجود پلاگین‌های متعدد
- امکان شخصی سازی و انتخاب تم مورد نظر
- امکان اجرا و دیباگ کد‌های جاوا بر اساس Maven و Gradle
 نتیجه اینکه انتخاب بهترین IDE برای برنامه‌نویسی بسیار حائز اهمیت است زیرا تاثیر زیادی در کیفیت کدنویسی شما خواهد داشت. در اینجا ما لیستی از 8 IDE مناسب برای انواع کاربرد‌ها و تکنولوژی‌ها معرفی کرده‌ایم که می‌توانید با انتخاب یکی از IDE‌های بالا بر اساس کاربرد مورد نظر خود، برنامه‌نویسی را با جذابیت بیشتری انجام دهید.


مقالات
سیاست
رسانه‎های دیجیتال
علوم انسانی
مدیریت
روش تحقیق‌وتحلیل
متفرقه
درباره فدک
مدیریت
مجله مدیریت معاصر
آیات مدیریتی
عکس نوشته‌ها
عکس نوشته
بانک پژوهشگران مدیریتی
عناوین مقالات مدیریتی
منابع درسی (حوزه و دانشگاه)
مطالعات
رصدخانه شخصیت‌ها
رصدخانه - فرهنگی
رصدخانه - دانشگاهی
رصدخانه - رسانه
رصدخانه- رویدادهای علمی
زبان
لغت نامه
تست زبان روسی
ضرب المثل روسی
ضرب المثل انگلیسی
جملات چهار زبانه
logo-samandehi
درباره ما | ارتباط با ما | سیاست حفظ حریم خصوصی | مقررات | خط مشی کوکی‌ها |
نسخه پیش آلفا 2000-2022 CMS Fadak. ||| Version : 5.2 ||| By: Fadak Solutions نسخه قدیم