Here are some helpful DevTools Extensions for both Visual Studio and Visual Studio Code! This can help juniors better optimize their code, time, and performance, but also remind more experienced ones of a few utile tools in aid of development or debugging.
01 Visual Studio Extensions
Visual studio spell checker
This extension checks the spelling of comments, strings, and plain text as you type or interactively with a tool window. It uses NHunSpell to perform the spell checking. As such, custom dictionaries can be added to spell check in different languages. Dictionaries for OpenOffice versions 2, 3, and 4 are supported.
It can also spell-check XML elements. If you have ever used MS Word, you should not have problem with using this extension, since it’s like spell checker that is present inside MS Word. You can see suggestion for wrongly spelled word, ignore suggestion or add new word to dictionary.
It is useful for preventing possible data conflicts caused by misspelling words.
CodeMaid
CodeMaid is an open-source Visual Studio extension to cleanup and simplify our C#, C++, F#, VB, PHP, PowerShell, R, JSON, XAML, XML, ASP, HTML, CSS, LESS, SCSS, JavaScript and TypeScript coding.
This tool is very powerful and can be used in various ways to improve your code and make it look more professional. Also, this tool can help you to organize your code and to navigate through it easily.
Three main parts of this tool that I would like to bring forward are:
- code cleanup
- code digging
- code reorganization
With Code cleanup you can:
- Erase random white space into a simple standard order
- Add unspecified access modifiers
- Utilize Visual Studio’s built-in formatting capabilities
- Remove and sort using statements
And do it all automatically on save or on demand, from an individual file to the entire solution.
Code digging visualize and navigate through the contents of your C# and C++ files from a tree view hierarchy. Quickly switch between different sorting methods to get a better overview. Drag and drop to reorganize the code.
Code reorganizing organizes the layout of members in a C# file to follow Microsoft’s StyleCop convention, or your own preferences. You can automatically generate regions to match and run it on demand or automatically during cleanup.
VSColorOutput
VSColorOutput is a Visual Studio extension that adds color highlighting to Visual Studio's Build and Debug Output Windows. Errors are in Red, Warnings Yellow and build headers are Green. Custom match patterns can be added and colors custom modified.
VSColorOutput hooks into the classifier chain of Visual Studio. This allows VSColorOutput to monitor every line sent to the output window. A list of classifiers, consisting of regular expressions and classifications is checked. The first matching expression determines the classification. If no patterns match, then the line is classified as Build Text.
IntelliCode
IntelliCode saves you time by putting what you’re most likely to use at the top of your completion list. IntelliCode recommendations are based on thousands of open-source projects on GitHub each with over 100 stars.
When combined with the context of your code, the completion list is tailored to promote common practices. IntelliCode isn’t limited to statement completion. Signature help also recommends the most likely overload for your context.
OzCode
Ozcode is a must have Visual Studio Extension which cuts down on debugging time and increases productivity by detecting and isolating bugs, making them easy to fix. Ozcode turns C# debugging into a simple, efficient, and even fun experience.
This extension integrates with the Visual Studio debugger and expands on its functionality. Among other features, Ozcode predicts the future of a function code execution and provides insights that enable fast problems solving. It allows to search for properties, compare objects, evaluate expressions, and create trace points - all leading to a fast and productive debugging session. It also predicts what will happen in a function after execution of other functions or parts of code (mostly loops).
Ozcode does to debugging what ReSharper does to coding, and they work seamlessly together. Studies have shown that developers spend about 50% of their time on debugging. This extension significantly reduces this time, and makes sure developers remain focused on development – what they do best.
02 Visual Studio Code Extensions
React snippet
This extension expands functionalities of Visual Studio Code with various kind of snippets, and it significantly increases productivity of developer. This extension is a must have for Frontend developers that works in React.
By inputting some of snippets that can be found inside documentation of this extension, it automatically generates skeleton for matching component. Writing base code to create new component is usually tedious and redundant because every time developer wants to create new component, he must add same import code, component function code, export default, etc.
This extension allows every developer to automatically generate all those previously mentioned parts of code by just inputting few letters. This package is based on babel-sublime-snippets package.
Prettier
Formatting code consistently can be a challenge, especially when working on a team. However, today, there plenty tools that can help us with code formatting, like Prettier. In a shortest way, prettier represents code formatte. It literally makes your code “prettier”, more unified, and cleaner. This extension enforces a consistent style by parsing your code and re-printing it with its own rules.
You can manage some of those rules inside settings of these extension, making it more custom and according to your preferences. It can fix spacing, line wrapping, consistent quotes and much more.
Code spell checker
This extension represents basic spell checker that works well with code and documents. Its main goal is to help developers catch common spelling errors.
All words that are not correctly spell are being marked with a squiggly underline. After positioning cursor in the underlined word, list of suggestions should be displayed. This extension works with camel case notation as well.
The spell checker is case insensitive, can contain errors and only words longer than 3 characters are being checked, but despite all of that this a very cool extension, especially for those ones whose first language is not English 😊
Turbo Console Log
Most of a time developers are fixing bugs and trying to see where exactly the problem occurs. For those purposes, most of them uses console.log, to see what is content of some variable instantly. Usually there is need to log into console several variables at once and writing that code can be annoying.
Turbo Console Log extension does that specific job for developers. After installing it, developer just needs to choose variables for logging, press ctrl-alt-l and magic will happen. Console log code for those variables will be created, and it will log combination of a variable name and its value.
Pre message of console log can be custom as well and it can be modified inside setting of extension. The best part of this extension is that it allows you to automatically delete all created console logs, so you don’t have to worry about pushing them as a part of your regular code. 😄
