👌 ۵۰ پلاگین فوق العاده Visual Stadio Code
https://goo.gl/0Ye50f
...

#vsCode

@webly

#Angular #Extension #VSCode

6 افزونه ی بسیار مفید و ضروری VSCode برای توسعه دهندگان Angular

با گسترش و فراگیر شدنِ برنامه های مبتنی بر Angular در محیط VSCode، افزونه ها(Extensions) ی متعدد و زیادی جهت سهولت در امر توسعه، تهیه و در دسترس قرار گرفتند. انتخاب و نصب این افزونه ها تا حد زیادی بر حسب سلیقه و نوع نیاز انجام می شود. اما در یک رده بندی کلی و عمومی، شاید بتوان 6 افزونه ی زیر را جزو کاربردی ترین آن ها دانست:

1- افزونه TypeScript Hero
اگر شما نیز به دنبال راهی برای افزودنِ اتوماتیکِ ایمپورت ها در فایل های تایپ اسکریپت هستید و همچنین مرتب سازی یا حذف ایمپورت های استفاده نشده برایتان از اهمیت برخوردار است، این افزونه مناسب برای شماست. البته این تنها بخش کوچکی از امکانات این افزونه مانند قابلیت code completion و ... می باشد:
https://goo.gl/f4t1BC

2- افزونه Angular Language Service
از طریقِ این افزونه، قابلیتِ auto-completion فیلدهای تعریف شده در کامپوننت را در تمپلیت HTML خود خواهید داشت:
https://goo.gl/GerGJH

3- افزونه Bracket Pair Colorizer
همان طور که از نام آن پیداست کار این افزونه، تطبیقِ براکت ها از طریق تمایز رنگ آنهاست:
https://goo.gl/cD3DUa

4- افزونه Move TS
کار این افزونه ی مفید، تغییر مکانِ فایل های تایپ اسکریپت و نیز فولدرهای حاوی آن و به روز رسانی ایمپورت های مرتبط با آن است. این افزونه به خصوص زمانی کاربرد دارد که به دلیل بزرگ شدن یکی از ماژول های موجود در پروژه، مجبور به شکستن آن به ماژول های کوچکتر و در نتیجه، انتقال فایل و فولدر های آن هستید:
https://goo.gl/svH4bs

5- افزونه Material Icon Theme
این افزونه دارای تعداد زیادی آیکون های متریال دیزاین برای VSCode می باشد:
https://goo.gl/HgSDAj

6- افزونه Angular TypeScript Snippets
این افزونه ی مفید تعداد زیادی code snippet آماده برای تولید سریع کدها مانند ایجاد کامپوننت، دایرکتیو، سرویس و ... را فراهم میکند. هر چند بسیاری از این موارد توسط برنامه ی خط فرمانی Angular CLI نیز امکان پذیر است، اما این افزونه شامل مواردِ بسیارِ دیگری از جمله snippet هایی برای تولید کدهای HTML نیز می باشد:
https://goo.gl/QfXzkf

منبع و توضیحاتِ کاملِ موارد فوق را میتوانید از طریق لینک زیر مطالعه نمایید:

https://goo.gl/LovRde

@IranAspMvc

کاملترین لیست #افزونه های مفید و کاربردی برای #VSCode قسمت اول

✅ 1- TSLint
https://marketplace.visualstudio.com/items?itemName=eg2.tslint
Integrates the TSLint linter for the TypeScript language into VS Code.
https://github.com/Microsoft/vscode-tslint.git
TSLint is an analysis tool that checks TypeScript code for readability, maintainability, and functionality errors.
https://palantir.github.io/tslint/

✅ 2- StyleLint
https://marketplace.visualstudio.com/items?itemName=shinnn.stylelint
Integrates the StyleLint linter for CSS/SCSS/Less into VS Code.
https://github.com/shinnn/vscode-stylelint
StyleLint is a mighty, modern CSS linter and fixer that helps you avoid errors and enforce consistent conventions in your stylesheets.
https://stylelint.io/

✅ 3- ESLint
https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint
Integrates the ESLint linter for EcmaScript into VS Code.
https://github.com/Microsoft/vscode-eslint.git
ESLint is a tool for identifying and reporting on patterns found in ECMAScript/JavaScript code (like JSLint & JSHint).
https://eslint.org/

✅ 4- GitLens — Git supercharged
https://marketplace.visualstudio.com/items?itemName=eamodio.gitlens
It helps you to visualize code authorship at a glance via Git blame annotations and code lens, seamlessly navigate and explore Git repositories, gain valuable insights via powerful comparison commands, and so much more.
Documation at :
https://github.com/eamodio/vscode-gitlens

✅ 5- Git History
https://marketplace.visualstudio.com/items?itemName=donjayamanne.githistory
View git log, file history, compare branches or commits

✅ 6- Path Intellisense
https://marketplace.visualstudio.com/items?itemName=christian-kohler.path-intellisense
Visual Studio Code plugin that autocompletes filenames.

✅ 7- IntelliSense for CSS class names in HTML
https://marketplace.visualstudio.com/items?itemName=Zignd.html-css-class-completion
CSS class name completion for the HTML class attribute based on the definitions found in your workspace.

✅ 8- CSS Peek
https://marketplace.visualstudio.com/items?itemName=pranaygp.vscode-css-peek
Extends HTML and js code editing with "Go To Definition" and "Go To Symbol" in Workspace support for css/scss/less (classes and IDs) found in strings within the source code.

✅ 9- Debugger for Chrome
https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chrome
Debug your JavaScript code running in Google Chrome from VS Code.

✅ 10- Language Support for Java(TM) by Red Hat
https://marketplace.visualstudio.com/items?itemName=redhat.java
Java Linting, Intellisense, formatting, refactoring, Maven/Gradle support and more...

✅ 11- PHP IntelliSense
https://marketplace.visualstudio.com/items?itemName=felixfbecker.php-intellisense
Advanced PHP IntelliSense for Visual Studio Code, powered by php-language-server

✅ 12- Vetur
https://marketplace.visualstudio.com/items?itemName=octref.vetur
Vue tooling for VS Code, powered by vue-language-server.
Documation at :
https://vuejs.github.io/vetur/

✅ 13- Docker
https://marketplace.visualstudio.com/items?itemName=PeterJausovec.vscode-docker
Adds syntax highlighting, commands, hover tips, and linting for Dockerfile and docker-compose files. This extension makes it easy to build, manage and deploy containerized applications from your Visual Studio Code.

_______________
@IranAspMvc

کاملترین لیست #افزونه های مفید و کاربردی برای #VSCode قسمت دوم

✅ 14- Code Runner
https://marketplace.visualstudio.com/items?itemName=formulahendry.code-runner
Run any Code in any Language :
Run code snippet or code file for multiple languages: C, C++, Java, JavaScript, PHP, Python, Perl, Perl 6, Ruby, Go, Lua, Groovy, PowerShell, BAT/CMD, BASH/SH, F# Script, F# (.NET Core), C# Script, C# (.NET Core), VBScript, TypeScript, CoffeeScript, Scala, Swift, Julia, Crystal, OCaml Script, R, AppleScript, Elixir, Visual Basic .NET, Clojure, Haxe, Objective-C, Rust, Racket, AutoHotkey, AutoIt, Kotlin, Dart, Free Pascal, Haskell, Nim, D, and custom command

✅ 15- VSCode-Icons
https://marketplace.visualstudio.com/items?itemName=robertohuertasm.vscode-icons
Beautiful icons for Visual Studio Code

✅ 16- Material Icon Theme
https://marketplace.visualstudio.com/items?itemName=PKief.material-icon-theme
The Material Icon Theme provides lots of icons based on Material Design for Visual Studio Code.

✅ 17- One Dark Pro
Atom's iconic One Dark theme, and one of the most downloaded themes for VS Code!
https://marketplace.visualstudio.com/items?itemName=zhuangtongfa.Material-theme
Documention at :
https://binaryify.github.io/OneDark-Pro/

✅ 18- Angular v6 Snippets
https://marketplace.visualstudio.com/items?itemName=johnpapa.Angular2
This extension for Visual Studio Code adds snippets for Angular6, TypeScript and HTML.

✅ 19- Angular 6 Snippets - TypeScript, Html, Angular Material, ngRx, RxJS & Flex Layout
https://marketplace.visualstudio.com/items?itemName=Mikael.Angular-BeastCode
Visual Studio Code TypeScript and Html snippets and code examples for Angular 2,4,5 & 6.

✅ 20- PowerShell
https://marketplace.visualstudio.com/items?itemName=ms-vscode.PowerShell
Develop PowerShell scripts in Visual Studio Code! This extension provides rich PowerShell language support for Visual Studio Code. Now you can write and debug PowerShell scripts in VSCode.

_______________
@IranAspMvc