Visual Studio Code stash with VS-Code

  • Article

Introduction

From hobbyist, novice developer to full-time developer nobody can remember everything to write code in Microsoft Visual Studio. Coders tend to either ask questions in developer forums or search the web for an answer or code that gets them started. A solution worked out is used then time goes by, in another project the same thing is needed and the coder remembers this but forgets where and could it be in a former job or perhaps another programming language?

Learn how to keep code that may be used in situations explained above or perhaps there is code found that was not needed but may be in the future.

Enter VS-Code

Microsoft VS-Code is a open source and very flexible editor that runs everywhere while it's not up to the level of Visual Studio it can be used for other things like house code snippets. These code snippets can be placed in a folder which for this article will be called CodeStash. Each sub-folder is like a chapter in a book which may contain sub-folders.

This is a sample folder structure under C:\CodeStash

Then under C:\CodeStash\csharp

Note in the above image, there are other sub-folders which in this case are actual full projects while in the files shown are not connected to the other files as they are code snippet.

Finding a snippet

A code snippet might be something easy to re-code for some developers while not for other developers. For instance, handling cross thread violation for interacting with controls from another thread.

using System;
using System.ComponentModel;
 
namespace WindowsFrontEnd.Extensions
{
    public static  class ControlExtensions
    {
        public static  void InvokeIfRequired<T>(this T control, Action<T> action) where T : ISynchronizeInvoke
        {
            if (control.InvokeRequired)
            {
                control.Invoke(new Action(() => action(control)), null);
            }
            else
            {
                action(control);
            }
        }
    }
}

Now to find the code above with a few files in the C# folder simply look for a telltale name while when there are a lot of files use the "find in folder".

With the explorer bar showing in VS-Code, right click on the folder and start typing for a key word, in this case typing "invoke" might pull up a lot of results while the coder remembers "if" was in the (extension) method name and ands "if".

 Click on a result to open the file. At this point copy the code to Visual Studio while in other cases the code may need modification and here the coder can either drop the code in and modify or make a copy in the resulting file, modify, copy to Visual Studio then clean up the result file.

Occasionally used languages

Suppose a coder uses C# and needs a script function, in this case it may have been found and tested from a web search, why not store it in a script folder in the event it may be needed again e.g.

function password_check() {
    pass = document.getElementById("password").value;
    console.log(pass);
    regex = /^(?=.*[a-z])(?=.*[A-Z])(?=.*\d)(?=.*[@$!%*?&])[A-Za-z\d@$!%*?&]{8,}$/;
    if (regex.exec(pass) == null) {
        alert('invalid password!')
    }
    else {
        console.log("valid");
    }
}

Working with a full project

In some case there may be a class project stored in C:\CodeStash, to use it, copy the project by right clicking in VS-Code file explorer which opens to Windows Explorer. Copy the folder to the current Visual Studio solution and add to the solution.

Source control

To ensure code in the code stash is a) backed up b) available from other locations create a GitHub account, create a (if you don't want others to see this code make it private) repository. See the following document on Working with GitHub in VS-Code as VS-Code comes ready to work with GitHub.

VS-Code from Visual Studio

To access the code stash from Visual Studio

  1. Fire up Visual Studio
  2. Click on the "Tools" menu
  3. Click on "External Tools"
  4. Click the "Add" button
  5. Provide a title e.g. Code stash
  6. For the command, if VS-Code was a default install use C:\Users\paynek\AppData\Local\Programs\Microsoft VS Code\Code.exe
  7. For arguments enter a period -> .
  8. Enter the folder location of the code stash for Initial Directory
  9. Click the Apply button then the OK button.

In the following screenshot there are several menu items besides code stash, the others simply open specific folders where there are Visual Studio solutions. The beauty of VS-Code is one can open folders with projects so in the case code is needed that is not in the code stash they are available also.

VS-Code useful extensions

Extensions that may assist with a code stash comparing to other code.

  • Compare Folders, allow a developer to compare two physical folders. Note, to compare against a GitHub repository this is built in to VS-Code.
  • Bookmarks, allow bookmarking code perhaps in one of the files in the code stash.

GitHub ignore files

Not all files should be stored in a repository, for instance, if node.js library is within the code stash, it's replaceable so ignore it. Here is a sample ignore file

node_modules/*
.gitignore

In the above example a folder names node_modules will not be pushed to the GitHub repository for code stash. This can be done in the source control tab in VS-Code activity bar. Note the file name is .gitignore and is also in the ignore file thus not committed/pushed to the GitHub repository.

Quick tips for VS Code

Summary

VS-Code is not simply for writing code but also for storing full project and code snippets which has been explained how to interact with Visual Studio.