Menu

Showing posts with label Visual Studio 2013. Show all posts
Showing posts with label Visual Studio 2013. Show all posts

Sunday, 30 November 2014

Skype Status Display For a User in MVC

Scenario
This article explains how to display the user Skype status in the user profile in a MVC application. The administrator in a site wants to view the list of users with his/her Skype status and also wants to chat/call by clicking on the Skype status in the user profile.

Prerequisites


To display the Skype status in a public site, the Skype user must check (select) the privacy setting "Allow my online status to be shown on the Web". You can go to the settings by navigating from the Skype menu Privacy settings and check the "Allow my online status to be shown on the Web" as shown in the following screenshot.



Implementation


Step 1

Create a new project named UsersSkypeStatusInMVC and choose the template MVC. It then creates an MVC template project.

Step 2

Add a Controller named AdminController with the following procedure.
  1. Right-click on the "Controllers" folder and select the Add option and click on the "Controller" link.

  2. It opens a pop-up and then select the option MVC 5 Controller – Empty and then click on the "Add" button.

  3. Again, it opens a popup and then provide the name as AdminController and click on the "Add" button.
Now, the controller is created with a default code.

Step 3

In this step, Add a Model named "UserModel" using the following procedure.
  1. Right-click on the "Models" folder and select the "Add" option and click on the "Class...".

  2. It opens a pop-up and then enter the name as "UserModel.cs" and click on the Add button.
After adding the model, replace the existing code in the file "UserModel.cs" with the following code.

namespace UsersSkypeStatusInMVC.Models    
{    
    ///     
    /// User Model    
    ///     
    public class UserModel    
    {    
        public int UserId { get; set; }    
        public string Name { get; set; }    
        public string Email { get; set; }    
        public string SkypeId { get; set; }    
        public string ProfileImagePath { get; set; }    
    
    }    
}  


Step 4

This step, replace the existing code in the "AdminController.cs" file with the following code.

using System.Collections.Generic;    
using System.Web.Mvc;    
using UsersSkypeStatusInMVC.Models;    
    
namespace UsersSkypeStatusInMVC.Controllers    
{    
    public class AdminController : Controller    
    {    
        // GET: UsersProfile    
        public ActionResult UserProfiles()    
        {    
            List usersList = GetUsers();    
            return View(usersList);    
        }    
    
        ///     
        /// Get the list of sample users    
        ///     
        /// User List    
        private List GetUsers()    
        {    
            var usersList = new List    
            {    
                new UserModel    
                {    
                    UserId = 1,    
                    Name="Ramchand",    
                    Email = "ram@abc.com",    
                    SkypeId = "ramchand.repalle", // Skype Id    
                    ProfileImagePath = "Ramchand.jpg"    
                },    
                new UserModel    
                {    
                    UserId = 2,    
                    Name="Abc",    
                    Email = "chand@abc.com",    
                    SkypeId = "abctest",// Skype Id    
                    ProfileImagePath = "abc.jpg"    
                },    
                new UserModel    
                {    
                    UserId = 3,    
                    Name="def",    
                    Email = "def@abc.com",    
                    SkypeId = "ram",// Skype Id    
                    ProfileImagePath = "def.jpg"    
                }    
            };    
    
            return usersList;    
        }    
    }    
}  

About Code
  1. The GetUsers() method will provide a sample list of users.

  2. You will call that method in the UserProfiles Action Result method and then send that list of users to the view.
Step 5

This step, add a view for the UserProfiles Action controller method by the following procedure:
  1. Right-click on the View() method in the UsersProfile Action method and click on "Add View".

  2. Enter the view name as "UserProfiles" and then click on the "Add" button.
Step 6

This step replaces the existing code in the "UserProfiles.csthtml" file design with the following code.

@model IEnumerable     
    
@{    
    ViewBag.Title = "User Profiles";    
}    

User Profiles

@foreach (var item in Model) { var skypeId = @Html.DisplayFor(modelItem => item.SkypeId); var profileImg = "../../Images/" + @Html.DisplayFor(modelItem => item.ProfileImagePath);
@Html.DisplayFor(modelItem => item.UserId)
@Html.DisplayFor(modelItem => item.Name)
@Html.DisplayFor(modelItem => item.Email)
ProfilePic
}

About the Design 
  1. Added a namespace to get the list of users.

  2. CSS styles are defined.

  3. A foreach loop helps to display the list of users with respective details.

  4. Skype: {SKYPE ID}?chat: This is the href tag, you can use to chat the Skype by clicking on that. For example: skype:ramchand.repalle?chat

  5. Skype: {SKYPE ID}?call: This is the href tag, you can use to call the Skype by clicking on that. For example: skype:ramchand.repalle?call

  6. JavaScript function SkypeUserStatus helps to assign the Skype status image.

  7. SetInterVal has been used to call the SkypeUserStatus function periodically to get the current Skype status of a user.
Step 7

This step helps you about Skype Status URL information and other details. To display the Skype status of any user, you have to request the URL format as follows.

The format of the URL is: http://mystatus.skype.com/{SIZE OF ICON}/{SKYPE ID}

{SIZE OF ICON}: It indicates to display the size of the icon based on user Skype status.

For example: smallicon, mediumicon

{SKYPE ID}: It indicates the Skype Id of the user.

For example: ramchand.repalle

So, the example of the Skype status URL is http://mystatus.skype.com/mediumicon/ramchand.repalle.

You can get the status of the user by just clicking on the previously shown URL.

Step 8

Add a new folder named “Images” with sample images to the “UsersSkypeStatusInMVC” project. It helps display the sample image for the profile picture as mentioned in the "GetUsers()" method in AdminController.



Step 9

Now, build the application (F6), then run (hit F5) an application and navigate to the following URL: (http://localhost:57882/Admin/UserProfiles).









As in the preceding screenshots by clicking on the (Skype) icon it displays a popup to launch the application in Skype. You just click on that then it would open a Skype user window.

The Skype status images are displayed as described below.



The discussed project source code can be downloaded from the link Source Code.

Conclusion


I hope this article helps you to display the Skype user status with the user profile details in a MVC application.


Multilingual MVC Application With Customized JS Bundles Based on User Language

About

This article shows how to create multilingual MVC applications with JS bundles based on various languages. Here, you will learn about multilingual MVC application implementation flow, the creation of customized JavaScript bundles with translated alert messages based on user language, custom HTML helper classes, how to set user language in a cookie based on his login, displaying resource translation values in a form and how to maintain names and values in resource files.

Scenario

You will implement an MVC application to be displayed in various languages based on the user selected language. The form content is being displayed from the resource file based on the name and respective language and it would need to display the alert kind of information from customized bundled JavaScript based on user language whenever the user has done a form submission or input validation and so on.

RoadMap
 
When implementing the previous sample MVC application, you will learn the following concepts.
  1. Resource File creation with key, value pair combination for required language.
  2. Resource Key value display in a form based on user language.
  3. Cookie implementation in MVC.
  4. Bundling and Minification.
  5. Custom HTML helper class.
  6. Customized Bundle creation.
  7. Translate the JavaScript alert messages into user selected language.
  8. Localized JavaScripts minified and bundled, It helps to increase the performance of form.
Step 1

Create a new project named “MultilingualMVCApp” and choose the template “MVC” then it creates an MVC template project.

Step 2

Add a new application folder named “App_GlobalResources” to maintain the resource files with key/value pair combinations for various languages. Right-click on the Project “MultiLingualMVCApp” and select on “Add” and then select “Add ASP.NET Folder” and then click on “App_GlobalResources” like the following.




Step 3

Create a resource file named “Notifications.resx” for the default language English by following the following screenshots. Right-click on the “App_GlobalResources” folder, select “Add” and then click on “Resource file” and specify the name as “Notifications” and then click on the “Ok” button.



Click on "Resources File" and provide the name as "Notifications" as shown in the following screenshot.



In the similar way, create another resource file named “Notifications.fr.resx” under the App_GlobalResources file. After completion of these aforesaid procedure, the Solution Explorer looks like the following.



Step 4

In this step, you will add sample resource keys with translation values for English and French languages. For that double click on the “Notifications.resx” file, then the displayed file has three columns named Name, Value and Comments.
Name: This name field is treated as the Resource Key value and it should be unique in the file and not be empty.
You can now enter the sample key and respective values as shown in the following screenshot for the default language (English).



In the same way, you can add the same key values, whichever were specified in the “Notifications.resx” with respective translated values for the French language in the “Notifications.fr.resx” file is as follows.



Note: Here, I have used the Google translator to translate the sample English content to French content.
In the same way, you can add various resource files for different languages as said and you can add multiple resource types to the resx files (like strings, images, icons and so on) based on your needs.



Step 5

You can now create one controller named “DemoController” with the following procedure.  Right-click on the “Controllers” folder and select the “Add” option and click on the “Controller” link.



Click on the "Controller.." link and select the option “MVC 5 Controller – Empty” and then click on the “Add” button. Then, specify the name as “DemoController” then click on the “Add” button.
Now, the controller is created with the default action named “Index” like the following.



Step 6
Add a view to the Index action method by right-clicking on the View function and click on “Add View” and then click on the Ok button. The following screenshots help you do that.



Click on "Add View..." then it opens a popup like the following.



Now, click on the "Add" button and then it will create an Index.cshtml file.

Step 7
 
Replace the existing design with the following design format that contains a sample form to enter the user name, select the user preferred language and the submit button.

@{  
    ViewBag.Title = "Index";  
}  
  

Demo

@using (Html.BeginForm("Index", "Demo", FormMethod.Post)) {

}

Now, build the application (F6) and run the application (F5) with the following URL (http://localhost:49624/Demo/Index) then the displayed form looks like the following.  




Step 8
In this step, write a piece of code for the post action of the submit button to set the user language code in the cookie, the user name in the TempData object (that helps to send data from one controller request to another) and then redirects to the home page.

    [HttpPost]  
     public ActionResult Index(FormCollection collection)  
     {  
         TempData.Add("LoggedInUser", collection["txtName"]);  
         string language = collection["ddlLanguage"];  
         SetCulture(language);  
      
         return RedirectToAction("Home");  
     }  
      
     ///   
     /// Set the culture based on culture code and set the   
     /// value in cookie  
     ///   
     ///   
     private void SetCulture(string cultureCode)  
     {  
      
         var cookieCultureLanguage = new HttpCookie("UserLanguage")  
         {  
             Value = cultureCode  
         };  
      
         Response.Cookies.Set(cookieCultureLanguage);  
      
         //Sets  Culture for Current thread  
         Thread.CurrentThread.CurrentCulture =  
         System.Globalization.CultureInfo.CreateSpecificCulture("en");  
      
         //Ui Culture for Localized text in the UI  
         Thread.CurrentThread.CurrentUICulture =  
         new System.Globalization.CultureInfo(cultureCode);  
      
     }  

The cookie that you have set in the previous code using the method “SetCulture” helps to display the respective user-selected language translated values in a form from the resource file.

Step 9

In this step, add one controller action method named “Home” to the "DemoController.cs" file with the respective view named “Home.cshtml” file.

///   
/// Home Action Controller Method  
///   
///   
public ActionResult Home()  
{  
    return View();  
}

Then, right-click on the View() method in the Home action and then click on "Add View..". After clicking on “Add View” it opens a template then click on the “Add” button then it creates a “Home.cshtml” page with default design. You can leave the design as it is, in later steps you can add the respective design changes.

Step 10

Add a method named Application_AcquireRequestState to the Global.asax.cs file that helps to set the culture based on the user-selected language if the cookie exists else it sets the default culture to English.

///   
 /// Application AcquireRequestState  
 ///   
 ///   
 ///   
 protected void Application_AcquireRequestState(object sender,   
EventArgs e)  
 {  
  
     string culture;  
     HttpCookie cookie = Request.Cookies["UserLanguage"];  
     if (cookie != null && cookie.Value != null   
        && cookie.Value.Trim() != string.Empty)  
         culture = cookie.Value;  
     else  
         culture = "en";  
  
     //Default Language/Culture for all number, Date format  
     System.Threading.Thread.CurrentThread.CurrentCulture =  
     System.Globalization.CultureInfo.CreateSpecificCulture("en");  
  
     //Ui Culture for Localized text in the UI  
     System.Threading.Thread.CurrentThread.CurrentUICulture =  
     new System.Globalization.CultureInfo(culture);  
 }

Step 11
 
In this step, you will implement a customized JavaScript bundle translator class. It helps to bundle the JavaScript with the respective user-selected language translated messages if any exists in the JavaScript file like alert, input validation messages and so on.
So, first create a new folder named “ResourceHandler”. For that right-click on the project “MultiLingualMVCApp” then select “Add” and click on “Add New Folder” and provide the name as “ResourceHandler” and then add a class file “JSTranslator” under the newly created folder "ResourceHandler".

Replace the “JSTranslator.cs” file code with the following code.

    using System.Text.RegularExpressions;  
    using System.Web;  
    using System.Web.Optimization;  
      
    namespace MultiLingualMVCApp.ResourceHandler  
    {  
        public class JSTranslator : IBundleTransform  
        {  
            #region IBundleTransform  
      
            ///   
            /// IBundleTransform Process method  
            ///   
            /// Bundle Context  
            /// Bundle Response  
            public void Process(BundleContext context, BundleResponse response)  
            {  
                string translated = ScriptTranslator(response.Content);  
                response.Content = translated;  
            }  
     
            #endregion  
     
            #region Localization Of Js Bundle Flow  
      
            private static readonly Regex Regex =   
                new Regex(@"GetResourceValue\(([^\))]*)\)",  
                               RegexOptions.Singleline | RegexOptions.Compiled);  
      
            ///   
            /// Translated script based on JavaScript content  
            ///   
            ///   
            ///   
            private string ScriptTranslator(string text)  
            {  
                MatchCollection matches = Regex.Matches(text);  
                foreach (Match match in matches)  
                {  
                    object obj = HttpContext.GetGlobalResourceObject("Notifications",   
                        match.Groups[1].Value);  
                    if (obj != null)  
                        text = text.Replace(match.Value, CleanText(obj.ToString()));  
                }  
      
                return text;  
            }  
      
            ///   
            /// Format the text as Clean while displaying  
            /// in JavaScript notifications  
            ///   
            ///   
            ///   
            private static string CleanText(string text)  
            {  
                text = text.Replace("'", "");  
                return text;  
            }  
     
            #endregion  
        }  
    }  

 About JSTranslator.cs code
  • The JsTranslator class is inherited from the “IbundleTransform”.
  • The Process method is implemented, as it just gets the BundleResponse content and translates the JavaScript with user-selected language alerts, if any, using the ScriptTranslator method and will be assigned back to that content to the BundleResonse.
  • The Regex expression is the key term we used in script files, based on that formatted the regex expression.
  • The Regex Key Term example, you used in scripts is: GetResourceValue(ResourceKeyName)
  • The ScriptTranslator method first gets the MatchCollection object based on regex expression and then based on the Match collection key name get the translated value using the method “GetGlobalResourceObject”
  • The GetGlobalResourceObject takes the parameters of Resource file name and Resource Key name.
  • The CleanText method helps to clean if any characters that creates a problem when displaying in JavaScript.
So, you have now successfully added a custom JavaScript bundle class.

Step 12

In this step, you will add two JavaScript files with sample functions under the “Scripts” folder.
The first JavaScript file named “UserNotifications” file. It contains the following function.
function UserTermsNotification() {  
    alert('GetResourceValue(UserTermsDisplayNotification)');  
}  
The second JavaScript file is named “UserOperations”. It contains the following functions.
function AddUserMessage() {  
    alert('GetResourceValue(UserAdded)');  
}  
  
function DeleteUserMessage() {  
    alert('GetResourceValue(UserDeleted)');  
} 

Step 13
 
In this step, you will bundle the previously created JavaScript files in BundleConfig.cs (that exists in the App_Start folder) using a custom JavaScript bundle that you have created in the JSTranslator.cs file. So, add the following code block to the RegisterBundles method and also add the required namespaces; those are:
using System.Collections.Generic;
using MultiLingualMVCApp.ResourceHandler;

    using System.Web;  
      
    namespace MultiLingualMVCApp  
    {  
        public class HtmlHelpers  
        {  
            ///   
            /// Localized JavaScript bundle   
            ///   
            ///   
            ///   
            public static HtmlString LocalizedJsBundle(string fileName)  
            {  
                string culture;  
                var cookie = HttpContext.Current.Request.Cookies["UserLanguage"];  
                if (cookie != null && cookie.Value != null   
                    && cookie.Value.Trim() != string.Empty)  
                    culture = cookie.Value;  
                else  
                    culture = "en";  
                fileName = string.Concat(fileName, "-", culture);  
                var output = (HtmlString)System.Web.Optimization.Scripts  
                    .Render(fileName);  
                return output;  
            }  
        }  
    }  

Step 14
In this step, you will implement the custom HTML helper class that helps to create a custom JavaScript bundle based on your needs. So, add a new class file named HtmlHelpers under the App_Start folder and then replace that with the following code.

using System.Web;  
  
namespace MultiLingualMVCApp  
{  
    public class HtmlHelpers  
    {  
        ///   
        /// Localized JavaScript bundle   
        ///   
        ///   
        ///   
        public static HtmlString LocalizedJsBundle(string fileName)  
        {  
            string culture;  
            var cookie = HttpContext.Current.Request.Cookies["UserLanguage"];  
            if (cookie != null && cookie.Value != null   
                && cookie.Value.Trim() != string.Empty)  
                culture = cookie.Value;  
            else  
                culture = "en";  
            fileName = string.Concat(fileName, "-", culture);  
            var output = (HtmlString)System.Web.Optimization.Scripts  
                .Render(fileName);  
            return output;  
        }  
    }  
}

 In the aforesaid Steps 13 and 14, you have included the custom JavaScript bundle in the BundleConfig.cs file and created a custom HTML helper class to use that specified language bundle based on the user-selected language.

The Bundling and Minification concept is very helpful to reduce the network traffic and file size while loading the form since it minifies the multiple JavaScript files into one file and the file is being cached. If you change the file content then it automatically gets the fresh content with a new version number. So it helps to increase the page performance in all aspects.

Step 15
 
In this step, you update the “Home.cshtml” form design with the following design.



You are done with the multi-language MVC application implementation process with user language-specific JavaScript bundled minified files. So, build the application (F6) and hit the (F5) key to run the application with the following URL (http://localhost:49624/Demo/Index).
Enter the user name and select the preferred language as English then the form will be displayed like the following.



Now, click on the Submit button then it navigates to the home page like the following.



The preceding page is self-explanatory about the implemented functionality. In the similar way when you click on the "Add User" and "Delete User" buttons then it displays the alerts in the English language.
Step 16

In this step, again you navigate to this URL (http://localhost:49624/Demo/Index) and select the user language as French and check the respective outputs as shown below.



Now, click on the "Submit" button, then it navigates to the home page.



The preceding page is self-explanatory about the implemented functionality. In the similar way when you click on the "Add User" and "Delete User" buttons then it displays the alerts in the French language.
You can download the preceding discussed sample project at Source Code.

Conclusion
I hope this article provides an idea of the implementation of multilingual MVC application flow, creation of customized JavaScript bundles with translated alert messages based on user language, custom HTML helper classes, how to set user language in a cookie based on his login, Displaying Resource translation values in a form and how to maintain names and values in resource files.




Tuesday, 16 September 2014

Visual Studio Key Notes



About:


The Visual studio editor is vast and provides a ton of features. As you are working with visual studio editor, you should know the few features for those helps you a lot to improve the productivity while developing a code.

So, In this post I am going to share with you about some of 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 above set of key points in visual studio along with some other, then while writing a code in visual studio 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 application, 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.

But, In Visual studio also provides an option to set “Multiple Browsers” set as default. So you can run the application from visual studio it would open in all browsers. So, The setting should be setup by the following way.



As, per the browser the default browser is “Google Chrome”. Click on Browse with button then the screen should display as below.



Now, Press the Ctrl button and click on “Firefox” then you are able to select two browser types (Just like select multiple list items from list box) and then hit on “Set as Default” button then the resultant screen would display is as follows.



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




Note: The debugging feature (hit F5) is allow only for single application 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 code file contains hundreds of lines, In out of that you are going to search for particular block / piece of code.

So, Normally to achieve the aforesaid requirement, you can use find or method name search for that few key strokes are required,

Instead of that, while 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 navigates to that particular code location is good right!!!..



Now, you can learn how can you setup this feature in visual studio 2013.

Steps:
  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 resultant window screen looks like as follows.




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 existing vertical bar only.

Peek Definition:


As a coding practice and better maintainability will follow code ayers or design patterns. In such a scenario, some of the methods will be inherited from the other classes.

So, In that cases if you want to check the method details with out moving to that particular this Peek definition helps you.

You, just need to place a cursor on any of the method and click on “Alt + F12” it opens small popup contains the method details.

Extensions:


Visual studio supports the extensions which helps to achieve the required things those are 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 Visual Studio gallery. Some of the extensions are as follows.
  1.     Spell checker
  2.     Go To Definition
  3.     Productivity Power Tools 2013

Spell checker:


Spell checker is one of the great tool as this would be very useful to get rid of some silly/typo mistakes while placing some comments in code level. As placing comments at code level is one of the best thing in code practices.

You can download the tool from this 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 current location window only with small popup also. Even though this extension provides in a other 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 Definition

Productivity Power Tools 2013:


The name itself indicates that this tool is very helpful to improve the productivity while writing the code in visual studio 2013. you can call this one as a package instead of extension as this comes with lot of options with customization settings even you can disable / change the setting as you desired.

you can check out description and get the details and download the extension from this link Power Tools.
Installed Extensions in a visual studio having a features like to disable or uninstall the extensions as well.

The Extensions are managed from Visual studio by following this steps.
  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 one which will provide great flexibility while writing a code in visual studio editor.

LESS: Less css is kind of dynamic stylesheet language which is very helpful while designing css for any templates or forms. you can get more details from my blog.

ZenCoding: ZenCoding is the one of the greatest feature (at least I feel) in the Web essentials. It helps you a lot to write HTML code in fastest way even visual studio 2013 provides itself a lot of features like (automatically closes (or modify/update) the tag when you write start tag and etc). You can get additional details from my blog.

It also contains a great list of features like TypeScript and etc. you can get more idea about web essentials by checking this link Web Essentials. you can download the web essentials separately based on  visual studio version, For Visual studio 2013 the  link for visual studio gallery  and official site link web essentials.

Code Snippets:


As a developer, Everyone have an idea of some basic C# code blocks like (if.. else, for, foreach, switch,while, creating constructor etc etc..)

But, Just think about it while choosing any one of the aforesaid code block, and just have a count of how many key strokes are used to write that block.

For Example, for writing single if condition like the below it would take minimum of 6 to 7 even visual studio provides automatic feature of closing of braces.

if()
{

}

But, If you have an idea of code snippets, you can achieve that one in only 4 key strokes. By typing “if” and then press “TAB” then visual studio will create if block for you.

The other example is, If you are having a class named as “Customer.cs” then you are going to create constructor for that class. By using 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 try..catch block, just write “try” and then hit TAB.

In the above scenario,The difficult thing is only you just need to have an idea on “ctor” will creates code snippet for constructor block.

Now, The question is how should you know these kind of things.

It is just simple, In any of the code block (c#) or even in .cshtml page block as well, Right Click and then click on “Insert Snippet” then the resultant screen would display like the below.




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, The same scenario, you could relate with visual studio editor code implementation.

For Example, if you want to get the details about a C# keyword “string”. Instead of searching in google or somewhere else , place a cursor on that keyword and hit “F1”.

The specialty of this search is sensitive framework dependent. Like , If you hit “F1” from the .Net Framework 4.5 application then the msdn help browser will open the result for .Net Framewoek 4.5 only.

The Visual studio provides offline base search also by changing the help preferences from visual studio.
 
 



Quick Launch:


This option is exists generally at right most corner of visual studio. Before discussing with you about this feature, just a few simple questions.
  1.     Have you ever searched in VS menus to for BreakPoints bar to get list of  BreakPoints?
  2.     Have you ever searched in VS menus for Immediate window?
  3.     Have you ever searched in a VS for Solution explorer if its not in right side of editor?

The Quick Launch will helps you a lot to avoid these kind of simple and even some complicated setting with out remembering all those as visual studio is a vast and it contains tons of features.

Bu just typing, some related words in quick launch it would gives a result by clicking on that it would opens the required ones. 
Few examples are mentioned below.
 




Refactoring:


Code Refactoring is also having its own importance while writing a code. Suppose if you have written some block of code as a initial code development. After certain moment, you have noticed that the same block of code will be required at some other location.

Then, Usually what you will do, Remove that block of code, create a method separately with that code then call that method in the required places where as desired.

The whole process will be managed by Visual studio Refactoring option.

You, Just need to do is only select the required code block, Right click and select the Refactoring option.


And then just click on "Extract Method"  then it opens a popup like the below.


Now, By Clicking on "Ok" button  then the code result will display is as follows.




Conclusion:


I hope the provided key notes on visual studio will help you to write code in a smart way with less pain.