How To Create The Boilerplate Code In VS Code 2022?

Create The Boilerplate Code In VS Code: Almost every platform in the existing time provides some extra features so that the users can work efficiently on it. Boiler plate/ code snippets are just one of the tools visual studio code provides so that the coders can work efficiently.

What is Boilerplate Code In VS Code ?

Suppose we are given a task to write a detailed article on the United States of America. Obviously, the term ‘United States of America’ would appear many time, which would be a tedious task for writer to write again and again. Hence, writer tends to use the terms US, USA to refer to the country.

In a similar way, when a full fledged coder sits to write a complex/big code, there is often some code or parts of code which he has to write again and again. That’s where boilerplate code/ code snippets come in.

Boiler plate code is just a shortcut used to bring a full fledged code which is previously defined and repeatedly used by the coder.

Need of Boilerplate Code In VS Code 

The boilerplate code has the following advantages:

1. Increases efficiency: As mentioned above, code snippets are written just once and then called back in our programs via some trigger words. Since the code is written carefully and in a well checked way while making code snippets, there are negligible chances of any error to come up in the program we write and hence, increases our efficiency.

2. Increases speed of coding: In normal cases, the programmer is supposed to write the whole code by himself. But by using code snippets while coding, the coder / programmer just has to type the trigger words and boom! the code appears. This greatly decreases the time consumption and increases the speed of coding.

3. Decreases boredom: When a person is given a task to write the same code again and again, it is but obvious that the person will get bored and might even loose the attention he was paying while doing the job. But by using code snippets, the coder doesn’t have to write the same code again and again and decreases his boredom. 

How to Create Boilerplate Code in the VS Code

 

There are two types of boilerplates in visual studio code :

1. System code snippets : These code snippets can be activated by the visual studio code extension which one can install from the visual studio code itself. User doesn’t have to create them.

Some common example of this type of  tools visual studio code provides are :

   i) main function code:

Default snippet for main function

   ii) switch code:

Default snippet for switch function

2. User defined code snippets: These are the code snippets created by the user according to their own convenience, usage and format. Here, we will be making a code snippet to print the whole outline of a normal C program and hence, user can start directly start coding without worrying about any header files or visual studio code extension. 

The code we expect to when using the tools visual studio code provides is:

expected output code

There are two methods to create a snippet which brings out the given output are as follows:

METHOD 1:

1. Click on the gear icon is the left bottom corner and then on the ‘User Snippets’ option.

Steps to making a snippet

2. Then choose the language in which you want to create the snippet here, C#.

3. A window like this appears.

Now, insert the triggering words in the place of ‘log ‘, description in place of ‘Log output to console’ and title of snippet in place of ‘Print to console’.

4. Then, insert the code you want as an output under the ‘body’ section in place of ‘console.log(‘$1′);’ in such a manner that that each line of the code is encapsulated under a different ”  “, . Also, you can have cursor at specific places in the snippets by writing $1, $2 and so on in the order.

For the above mentioned example, we use ‘main2’, ‘C program and ‘Basic outline of C program’ as triggering words, description and title respectively. 

wrinting code snippet

Save the snippet with Ctrl+S.

Your user snippet is created. Now you can go in your program and activate the snippet via triggering words.

Triggering the snippet

Press the enter key and you get the desired code in your program!

Using snippet in our programs

METHOD 2:

You can also avoid all this work and refer to sites like Online snippet generator, make JSON of snippets and use them in your own programs.

For example, let us make the same snippet as above using the online snippet generator.

1. Open Online snippet generator. You will get a window like this.

Online snippet generator welcome window

2. Now enter the description, trigger words and code under the respective sections as above.

   Description: C program

   Tab trigger: main2

   Code:

#include <stdio.h>
#include <stdlib.h>
#include <conio.h> 
#include <math.h> 
#include <string.h> 
#include <time.h> 
int main() 
{ 
//code 
return 0; 
}

and you get a window like this:

3. Now, copy the snippet and paste it in the window we get and paste it in the window we got in Step 3 of the previous method. 

Save the snippet with ctrl+s.

Now, you can easily access this snippet in your program by typing the trigger words.

Accessing snippet via triggering words

Press the enter key and boom! The code appears.

Using snippets in program

Thanks for reading and holding up with the patience. I hope this article on How To Create The Boilerplate Code In VS Code was helpful to you. Happy learning!! 😊

Leave a Reply

Your email address will not be published. Required fields are marked *

Next Post

Top JavaScript Frameworks Worth Using In 2022

Related Posts