This week I was working on my school's vs code extension which is open-sourced and hosted on the github.

Overview

The feature I decided to implement came to somebody in the discussion in our school community and the idea was to make some functionality that will allow people to have some 'header' with some student information on the top of it (some sort of header). It had to include the student's name, email, the path to the file etc.

How to implement

The perfect implementation that I had in my head was -> user creates the file and the header with information about him is automatically inserted on the top of the file. Unfortunately, we live in the real-world where I had almost zero knowledge about making vs code extensions so as the first iteration of this feature I decided to make just a code snippet. Luckily, vs code provided some good documentation about creating code snippets for your code extension and also I find one very useful youtube video about it.

Implementation

Implementation itself wasn't very complicated and I just had to create the .json file with snippets, the snippet itself and associate the snippet with the project in package.json and list supported programming languages which will work with it.
The snippet itself ended up looking like this:

"Student File Header Template": {
         "prefix": "!fhead",
         "body": [
         "$LINE_COMMENT $RELATIVE_FILEPATH",
         "$LINE_COMMENT Created on: $CURRENT_MONTH_NAME $CURRENT_DATE $CURRENT_YEAR",
         "$LINE_COMMENT Student name: ${1:fullname}",
         "$LINE_COMMENT Student email: ${2:email}@myseneca.ca",
         "$LINE_COMMENT Course: ${3:coursename}",
         "$LINE_COMMENT Section: ${4:section}"
         ],
         "description": "Place file header with student info"
         }

Testing

The best way I found to test it was like this:
I tested it manually way just by copying the project's directory and pasting it to the extensions folder in ~/.vscode/extensions and reloading vs code after that. The newly created snippet !fhead should become available for you (refer to package.json for supported languages)

PR

When I was done I created the PR, where some of my peers left some comments with some minor proposals, which I resolved and the PR got approved and merged.

Conclusion

I have never worked with vs code extensions before and I find this experience very interesting. I would love to work on this kind of project more.