Visual Studio 2013 Key Notes

The Visual Studio editor is vast and provides a ton of features. As you are working with the Visual Studio editor, you should know the few features to use very often to improve your productivity when developing code.

So, In this article, I will share with you some of the Visual Studio key points.

  1. Features
  2. Extensions
  3. Web Essentials
  4. Code snippets
  5. Help
  6. Quick Launch
  7. Refactoring

If you follow the preceding set of key points in Visual Studio along with some others then when writing code in Visual Studio then it is just like a communication or discussion between you and Visual Studio.

Features

  1. Multiple Browsers set as Default
  2. Show code Preview tool tip
  3. Peek Definition

Multiple Browsers set as Default

This feature is really very helpful when you get a chance to work on applications, it should support various browsers. Normally, what you should do is run an application in one browser and then copy the same URL to another browser to check the browser dependency or UI perspective or some other ways. Visual Studio also provides an option to set “Multiple Browsers” as the default. So you can run the application from Visual Studio and open in all browsers. So, the setting should be set in the following way.

browse with

As, per the browser the default browser is “Google Chrome”. Click on the "Browse With..." command then the screen should display as in the following.

defautt browser

Now, press the Ctrl button and click on “Firefox”. You are then able to select two browser types (just like selecting multiple list items from a list box) and then hit on the “Set as Default” button then the next screen would display is as follows.

add browser

Then close the window and hit the “Ctrl + F5” button to run the application in two browsers (Google Chrome and Firefox) at a time.

customer detail

Note: The debugging feature (hit F5) is allowed only for single applications only. This multiple browser feature would be useful especially to test the GUI display for various browsers.

Show Code preview tool tip

This feature will be useful when a code file contains hundreds of lines, in out of that you will search for a specific block or piece of code. So, normally to accomplish that requirement, you can use find or a method name search. For that a few key strokes are required. Instead of that, when just moving the mouse to the vertical scroll bar location as it opens a small glance popup it would show the piece of code and just by clicking on that it would navigate to that specific code location; that is good, right?

present address

Now, you can learn how can you setup this feature in Visual Studio 2013.

Procedure

  1. Tools
  2. Go to Options
  3. Expand Text Editor
  4. Expand C#
  5. Select Scroll Bars
  6. Go to the Behavior panel
  7. select the “Use map mode for vertical scroll bar”

The window that appears looks as follows.

scroll Bars

Note: I hope this feature will be helpful when you are working on big screen like extended monitor it would be useful, for normal small laptop screens you can go with an existing vertical bar only.

Peek Definition

As a coding practice and for better maintainability we will follow code layers or design patterns. In such a scenario, some of the methods will be inherited from the other classes. So, in that case if you want to check the method details without moving to that specific file this Peek definition helps you. You just need to place a cursor on any of the methods and click on “Alt + F12”. It opens a small popup that contains the method details in Visual Studio 2013.

Extensions

Visual Studio supports the extensions that helps to do what is required yet not included or in a better way by creating Visual Studio extensions in (.vsix) file format. You can install/manage the Visual Studio extensions from Visual Studio itself by navigating to Tools and Extensions and Updates or else you can directly install extensions from the Visual Studio gallery. Some of the extensions are as follows.

  1. Spell checker
  2. Go To Definition
  3. Productivity Power Tools 2013

Spell checker

The Spell checker is one of the great tool since this will be very useful to get rid of some silly/typo mistakes when placing some comments in the code level. Since placing comments at the code level is one of the best things in code practices.

You can download the tool from the link Spell Checker or else you can directly install from Visual Studio as well.

Go To Definition

Visual Studio provides so many features like (F12) to go to the definition of code and (Alt+ F12) peek definition to view the code in the current location window only with a small popup also. Even though this extension provides another way to view the code. If you press and hold the Ctrl key and just mouse over any definition then it turns into a hyper link. By clicking on that link it would navigate to that definition of the code block.

You can download that one from this link Go To Defintion.

Productivity Power Tools 2013

The name itself indicates that this tool is very helpful to improve the productivity when writing the code in Visual Studio 2013. You can call this one as a package instead of extension since this comes with many options with customization settings. You can even disable or change the settings as you desire.

You can check out the description and get the details and download the extension from this link Power Tools.

Note

Installed Extensions in Visual Studio have features like disabling or uninstalling the extensions as well. The extensions are managed from Visual Studio by following this procedure.

  1. Tools
  2. Go To Extensions and Updates.
  3. Select Installed option on left most corner from the opened pop-up.
  4. It would show the list of installed extensions.
  5. Now, You can disable or Uninstall the required extension.

Web Essentials

Web essentials is also one of the best ones that will provide great flexibility when writing code in the Visual Studio editor.

LESS

Less CSS is kind of a dynamic stylesheet language that is very helpful when designing CSS for any template or form. You can get more details from my LESS CSS Details on my blog.

ZenCoding

ZenCoding is the one of the greatest features (at least I feel) in the Web essentials. It helps you very often to write HTML code in the fastest way. Visual Studio 2013 even provides itself many of the features, like automatically closing (or modify/update) a tag when you write a start tag and and so on. You can get additional details from my Zen Coding details on my blog.

It also contains a great list of features like TypeScript and and so on. You can get a better idea of web essentials by checking this link Web Essentials. You can download the web essentials separately based on the Visual Studio version. For Visual Studio 2013 the link from the Visual Studio gallery is web essentials.

Code Snippets

As a developer, everyone has an idea of some basic C# code blocks (like if.. else, for, foreach, switch, while, creating constructor and so on and so on).

But, just think about it while choosing any one of the aforesaid code blocks and just have a count of how many key strokes are used to write that block. For example, for writing a single if condition like the following it would take a minimum of 6 to 7 key storkes. Visual Studio even provides the automatic feature of the closing of braces.

if()
{
}

But, If you have an idea of code snippets, you can use it in only 4 key strokes. By typing “if” and then press “TAB” then Visual Studio will create the if block for you. The other example is, If you are have a class named as “Customer” then you will create a constructor for that class. By using a code snippet you can just type “ctor” and then hit TAB.

Thats it! The constructor is ready with the code.

In the similar way for writing a try..catch block, just write “try” and then hit TAB. In the preceding scenario, the difficult thing is you just need to have an idea of the “ctor” that will create a code snippet for a constructor block.

Now, the question is how you should know these kinds of things.

It is just that simple. In any of the code blocks (C#) or even in a .cshtml page block as well, right-click and then click on “Insert Snippet” then the next screen would display as in the following.

asp dot net mvc

You can select or review the code snippet names by checking in “Visual C#” or “ASP.NET MVC4” or others and then habituate in the day to day coding style then definitely you could do better code in a productive manner.

Help


As a developer, you can learn the things in a day to day code by exploring the things. In this manner, Help is needed to learn or understand the things. In the same scenario, you could relate with the Visual Studio editor code implementation. For example, if you want to get the details of the C# keyword “string”. Instead of searching in Google or somewhere else, place a cursor on that keyword and hit “F1”.

The search is context-sensitive. Like , If you hit “F1” from the .Net Framework 4.5 application then the MSDN help browser will open the result for the .Net Framewoek 4.5 only. Visual Studio provides an offline based search also by changing the help preferences from Visual Studio.

program cs

Quick Launch

This option exists generally at the right-most corner of Visual Studio. Before discussing this feature with you, here are a few simple questions.

  1. Have you ever searched in Visual Studio menus for the BreakPoints window to get a list of BreakPoints?
  2. Have you ever searched in Visual Studio menus for the Immediate window?
  3. Have you ever searched in a Visual Studio menus for Solution Explorer if its not in right side of the editor?

The Quick Launch will help you very often to avoid these kinds of simple and even some complicated settings without remembering all those since Visual Studio is a vast and it contains tons of features. Just by typing some related words in quick launch it provides a result by clicking on that. It would open the required ones.

A few exmples are provided below.

select soluction explorer

Refactoring

Code Refactoring also has importance for writing code. Suppose if you have written a block of code as an initial code development. After a certain moment, you will see that the same block of code will be required at some other location.

Then, usually what you will do is to remove that block of code, create a method separately with that code then call that method in the required places where desired. The entire process will be managed by the Visual Studio Refactoring option. You just need to select the required code block, right-click and select the Refactoring option.

refactor

By clicking on Extract Method the popup window opens as in the following.

new method name

Now, just click on the Ok button. That will create a method and the window that appears like the following.

method

Conclusion

I hope the key notes on Visual Studio will help you to write code in a smart way with less pain. Please provide your valuable suggestions and comments if any.

Thanks,
Ramchand