EditorConfig: A simple way to manage consistent coding style

As per Robert Martin, Code should be elegant, efficient, readable like well-written prose . I’m also a strong believer of that. There are two key observations that I often see in code when multiple people work in a team. These are

  1. Everybody has different coding style so they write the code in their own way unless a common coding guideline is followed by team. It’s always advisable to make it part of an automated process.
  2. New members join the team and if they are not properly guided, chances are more to have spaghetti code. It becomes more problematic if the new members are junior developers/interns.

These issues can be solved at certain extent with the help of editorconfig file. In this file, we can define a set of rules (we will discuss few) which can be extremely useful to maintain the code consistency. This file can be made a part of solution so it is available to every team member.

Editor Config has it’s own format and guidelines to define the rules which can be seamlessly used by multiple editors like VS Code, Sublime, Vim, Netbeans, Eclipse, notepad++ and many more.

Follwing are the common set of rules which can be used

  • indent_style
  • indent_size
  • end_of_line
  • charset
  • trim_trailing_whitespace
  • insert_final_newline
  • tab_width

Let’s see an example. I have specified the editorconfig as

Here, I provided the indent style, indent size as tab and tab size. The last item trim_trailing_whitespace is set as true. One more thing, these rules will be applied to csharp (.cs) file but we can more file types as [.{cs,vb,js}] or even [*].

Note: The default values of these settings are available in Visual Studio IDE but once we add the editorconfig is added in project, it overrides the IDE setting. A notification also appears as

Let’s first discuss the first three as they are related. The default value for tab size is 4, but here I made it 3. As indent size is marked as tab, it has the power to resolve the whitespace vs tab issue :). Now when a developer uses whitespace for identation, it will turn to tab. In the below example, we can see, for few lines tab is used and for other spaces.

 

If the code is written with the above settings it will be as

Note – I have used ctrl+r, ctrl+w to see the tabs and spaces in the VS IDE.

Also the last settings helped in removing unnecessary white spaces after at the end of the line.

.NET related code conventions can be divided in three categories as

  1. Language Conventions
  2. Formatting Conventions
  3. Naming Conventions

Language Conventions: As the name suggests, these are related to the C#/VB language like using braces, using var instead of explicit type etc. The format looks as

options_name = false|true : none|suggestion|warning|error

Here we need to provide two values true/false and severity. true means prefer this style and false is opposite. Severity has four options as below

  1. none/silent : This will be used by code generation features only. No indication to user if it is not followed.
  2. suggestion : In case of violation, show a suggestion to user which appears as eclipses under the first two characters.
  3. warning : Shows an warning by underlining the variable with green squiggly.
  4. error: Shows an error by underlining the variable with red squiggly.

Let’s see an example. Here first we will see the editorconfig

Now let’s see the code

Here in first part of the image, we can see the gray squiggly and when we select, it displays a suggestion to change it var as per the editorconfig. Also we see the quick action icon which allows us to change with a preview (depicted in second part of the screen). Similarly, let’s see other options

 

In first part of the image, we can see a green squiggly as we configured to have braces and set is as warning. While second part of the pic, we see red squiggly which denotes an error as we configured to use predefined type. So based on our project needs, we can have a specific config file so we every member in the team follows the same rule.

Formatting Conventions : We have a set of rules which can help us in defining formatting guidelines of our code files. These formatting rules can be defined as

rule_name = false|true 

The rules could be as

Here first rule says system directive should be written first while other suggests not to have single line blocks, instead have it in multiple lines. There are many other rules which can be extremely helpful in maintaining the consistency. You can find all the list here. Similarly, Let’s have quick look on naming conventions.

Naming Conventions : Naming of the variable is also one of the key items while writing the code and .NET supports a list of rules which can be used in the editorconfig file. These rules are fully customizable. Let’s say we want a rule where we want public members as captilazied. It can look as

Here we created a new rule (public_members_must_be_capitalized) and provided the definition for that. For details, refer the documentation here.

Now we can see that this file is extremely useful. It may take some time to create but once done, pretty usefull. We can have files at solution and/or project level. At soultion we need to mention root = true as in the first image.

Editor Config has native support in Visual Studio 2017 but for earlier version of Visual Studio you can install the extension from here.

So hope you have enjoyed the post and would be able to use in your projects.

Cheers,
Brij

Advertisements

TracePoint : An awsome feature of Visual Studio

Have you ever wanted to see the intermediate values of a variable which is inside a loop without pausing the execution via breakpoint?

I am sure you will say YES. A visual studio feature called Tracepoint can be very helpful in these scenarios.

Breakpoint allows to stop at a point where you can see the variable value but you may loose the track of it loops for more than 4-5 times.

Tracepoint is an awesome feature of Visual Studio and it is available since Visual Studio 2005. It allows you to write the values in output window without even stopping at any point or you can stop it after the loop and see how the loop progressed based on your needs. I recently started using it and found is very useful. I am sure it is relatively less used.

Let’s see an example. Here I have created a simple program which finds out the nth number in a fibonacci series. Lets see the code

Now I am going to set a tracepoint at line #41. To set up a tracepoint, one need to set up a breakpoint and right click on it which provides few options, then select Actions which opens window as

(In earlier versions of Visual Studio, the options was named as Choice which is Actions as mentioned above)

Here I have written i={i} => result={result} . The values insde {} are the variable names in the program and the value of these variables will be printed.

The messages will be logged in output window. See here the check box Continue Execution which is self explanatory. If you uncheck this then the breatpoint would be hit as normal and pause the execution. So lets run the program and see the output window

I have provaide value 7. Here you can see that the value got printed here for each loop iteration. This is quite useful if number are pretty high.

Debugging is also get tricky in case mutli-threading and asynchronous programming scenarios which is pretty common nowadays.

There are few others pseudo variables available which can be used display various other useful information as

Hope you have enjoyed the post.

Cheers,
Brij

[Video] Visual Studio Tips to make you Super Productive – Part 3

Hi All,

This video is in continuation of my last two video posts where we discussed some awesome visual studio tips which makes you super productive. In first video, we talked about tips related to Class and in second video, we discussed some other common tips for adding very common code snippets. Please find my previous two videos below

[Video] Visual Studio Tips to make you Super Productive

[Video] Visual Studio Tips to make you Super Productive – Part 2

In this video, we are going to discuss another 10 tips related to Visual Studio IDE which will help in day to day development, debugging, code review etc.

Use these tips in day to day activities and be few steps ahead 🙂

Cheers,
Brij

Top 12 tricks to insert common code snippets : Productivity Tips

This post is in line with my previous post where I talked about how one can be more productive with Visual Studio. In last post, We discussed top 12 shortcuts that helps a lot while writing and reviewing code in day to day work. While writing code we need to follow to follow certain rules and constructs that also becomes very repetitive say, you are writing classes for your domain or adding properties or defining constructors or putting try block and lot more where we just need to write the code in similar pattern and are no brainer. Spending time in these types of code are kind of waste of time and energy. To see my previous post, use the link below

Top 12 Visual Studio short cuts – Productivity Tips

In this post, I am going discuss 12 tricks that can insert code snippets just by few keystrokes.

1- Writing a class is a one of the most common repetitive code we write. Use

  class press TAB

1-Class

 

 

 

Once the snippet inserted, it puts the cursor at MyClass which allows to change the name of class instantly without any extra keystroke.

2- Writing constructor is also another task which is very common and many times we many constructor for the same class. To write constructor use

ctor press TAB

ctor

 

 

 

3- Now Class is created. Let’s add property now. Use

prop press TAB

2-Prop

 

 

Similar as 1st trick, it puts the cursor to change the type and after that change the property name itself. I found really cool when I used first.

It comes with many other flavor. Use propg  to create a auto implemented property with private set.

4- Second trick allows us to write auto-implemented property which requires less code but there could be many scenarios, when we need to write Full property definition that we used in earlier to C# 3.0 then use

propfull press TAB

3-propfull

 

 

 

 

Changing type and name can be done similar to above.

5- Need to write an indexer, use

indexer press TAB

indexer

 

 

 

6- Many times while code review we see that some part of code is not under try catch block or we need to write the block. Use

try press TAB

5-try

 

 

 

 

There is another flavor, if we just want try and finally then use tryf.

7- Want to create enum use

enum press TAB

enum-6

 

 

 

Similarly use struct to insert struct block.

8- Want to create switch block, use

switch press TAB

7-switch

 

 

 

Similarly use for, foreach, do, while etc to insert respective code blocks.

9- Many times we need to write our own custom exception class that should inherit from Exception class. It can written easily by

Exception press TAB

It creates a serializable class as

8- Exception

 

 

 

 

 

 

10- Want to override Equals method for your class. Use

equals press TAB

It will insert as

9-equals

 

 

 

 

 

 

 

 
 

 

 

 
11- To write static void main, use

svm press TAB

svm

 

 

 

Similarly you can use sim for static int main.

12 – last, many times we write console.writeline in our application. Just use

cw press TAB

10-cw

 
 
 

In this post, how can we save lots of keystrokes and time while writing some very common repetive code. This is not complete list but very common ones that can be used a lot in our day to day coding. if you know any other snippet which is very useful, do share in comments.

Cheers
Brij

Top 12 Visual Studio short cuts – Productivity Tips

Visual Studio is very Rich IDE and it provides in-numerous features that makes our day to day life easy. There are some very useful hot keys and tips which can increase our productivity significantly. Earlier I used few hot keys but recently I learned few which I found awesome which drastically reduce my time while writing/debugging/reviewing the code. So learn these and make a habit of these keys and feel super charged while writing code.

  1. While code review I find many time scattered and unaligned code which I hate. I use CTRL+K+D for aligning it.
  2. While debugging or testing the code, commenting/commenting codes are done a lot. Use CTRL+K+C/CTRL+K+U for the same.
  3. How do you up/down certain line of code. Select the code block and use ALT+up/down
  4. You have a used a lot F12 to go to Definition of class. Use CTRL – to go back.
  5. How do you resolve the classes by mouse click. Use CTRL+. to resolve it quickly.
  6. Refactoring is very important. Use CTRL+R+M for extracting a method.
  7. Find All References -> Use Shift + F12. Very helpful while debugging and fixing bugs.
  8. Want to put few lines of code in try block. Try Ctrl + K + S, it provides lot more options
  9. Ever tried selecting a rectangle code. Use ALT click drag.
  10. Lots of code in a single file. Use  CTRL + M + O and CTRL + M + X in collapse/expand code groups like regions, methods etc.
  11. Lots of code and there are no groups. Use CTRL+M+H/CTRL+M+U
  12. Another super sweet. ALT+F4 to close the window.

Try using the above in your day to day coding and be more productive.

Cheers
Brij

 

A starter guide to Page Inspector

There is a very exciting tool that was launched by Microsoft with Visual Studio 11 Developers Preview. That is Page Inspector.

Web development has always not been a very simple job. Every web developer must have spent lots of time to give a better look to the web page and have worked a lot with HTML syntax.

There are a lots of tools that helped the web developers a lot and became a lingua franca in web development community. Some of these tools are

Browser diagnostics tools

Browser diagnostics tools

Continue reading