Three things you should know as a vscode user

Three things you should know as a vscode user

Are you a developer and using vs code then you came to the right place. In this blog I will talk about the 3 things you should learn while you are using vs code and make life easier and code faster. Let's get started

  1. Prettier:-

It is a code formatter which will help you to format your code. It is available in vs extension. Firstly we have to install the prettier extension and reload the vs code as per below.

Now Open the settings tab and search for Default formatter and set it as prettierer code and next search for Format On Save and click the check box.

Now we are ready to use prettier functionality. It is helpful for you to format the code. It will remove unwanted spaces and lines in the file like below example where I added unwanted empty lines when I click save button everything is removed.

Now let's discuss one more feature from prettier. By default prettier gives us double quotes if you don't want the double quotes and you want to make it as single quotes then follow this First you have to add a .prettierrc file on your directory and type this to avoid double quotes.

{
  "singleQuote": true
}

Have a look at the picture below for better clarity.

Now You are done with it not only this there are many prettiers code that you can manipulate you can head over to official website of prettier where you can find many things that you can use it and make development easier.

2 . User snippets

Now let's discuss about the user snippets what does it mean ok let me tell you now if you don't want to write the entire common code like for example in javaScript console.log then we have a alternative for it

console.log(' ');

Let me tell how to use the alternative firstly we have to go to files and then preference tab now go to New Global Snippets file and then type any name as per your preference and then click enter now you will landed on that now type

"Print to console": {
    "scope": "javascript,typescript",
    "prefix": "cl",
    "body": ["console.log($1);"],
    "description": "Log output to console"
  }
}

These lines of code specify the shortcut for console.log and I have named the prefix as 'cl' . You can give any name as per your preference. You have a look at the pictures below for step by step procedure.

3 . How to open a code/file on vs code in a easy way

You can easily open the code/file on vscode by opening the directory on your local machine and press ctrl+l and now type cmd and press enter now it will open command prompt now we have to type code . and press enter now it will open it on vs code the entire directory that is simple it is. The below pictures follow the same thing.

Conclusion:-

In this blog we have discussed useful shortcuts for vscode and made developer life easier and I will keep updating this blog with more like this in future. Thank you and signing off