Tips for a helpful Visual Studio Code

Visual Studio(VS) code is one of the most famous editors. This editor can be so helpful if you add some stuff and use some of its features. Here are some tips for bewitching your VS Code for something that can really help you

Use shortcuts

Shortcut will help us simplify our job, we only need to type some keys and we get the feature or specific task work. Uhmm I am sure there are many shortcuts on VS Code, but I think these are the shortcuts that you have to know

Ctrl + Shift + ` for opening a terminal

Ctrl + P for navigating to any file

Ctrl + Shift + P for opening command palette.

The command palette will give us access to the functionality of VS Code, including keyboard shortcuts for the most common operations like using some functionalities of an extension

2. Integrate your VS Code

Integrating VS Code with other apps will help you so much. For example, integrate your VS Code with bash or windows shell. For integrating it you only need to add this line "terminal.integrated.shell.windows":"path/to/app"

to setting.json

for example

"terminal.integrated.shell.windows":”C:\\ProgramFiles\\Git\\bin\\bash.exe”

3. Extensions

Bet you will need this stuff so much. There are tons of extensions for VS Code, so we have to choose the right extensions based on our needs. Here there are some extensions then I recommend to have generally

Theme

For some people, it may be important but for other people, it maybe be not. But I think this is important since we will use VS Code as our job environment so it needs to be customized as pretty as possible so we are comfortable with it. There are so many themes in VS Code but one of the best I think is the Dracula theme :)

Not only the theme you also can change the font family of your code. You only need to make a little setting on preferences

Material Icon Theme

This extension will help you differ the extension of each file on your codebase and it’ll make the color of some folders are different. Once you installed it, your folder will turn to something like this

Sublime Text Keymap and Setting Importer

This extension is for mapping a task/feature to a specific shortcut like Ctrl + Shift + O for opening an app. With this extension, you only need to type the shortcut in your keyboard and then booom there is something opened in front of you(like a dialog box or something you have set before).

Formatter

Well, with formatter you don’t need to worry about the look of your code, your code will be beautified with this stuff. The example is PHP Fixer

with this extension, once you saved your file, this extension will beautify your code for you. But you can also use another extension like prettier

Auto Close Tag

If you work on web development you will use much HTML. But sometimes it’ll spend your time typing the open tag and the close tag, and the scary thing is you don’t know where is the close tag for a specific tag. With auto close tag we only need to type open tag and then the close tag will be generated automatically.