I've been using VS code for almost a year now and had watched and had read a couple vs code tricks that you could find elsewhere in the internet , And i wanted to share the tips and tricks that I had found that could help you love VS Code more.
Gitlens for git integrations
I've had this extension installed in the past but I wasn't leveraging the full potential of it. After spending some time learning about this extension I was blown away by what it can do, it had made my developer experience truly great as you no longer have to go into the terminal to type those git commands.
Track recent changes
This is pretty useful if you want to see the new changes you've made.
sync created branch to github repository
Ever had that time when you're creating a new branch and wanted to sync it in the Github repository, Gitlens can do that too and if you're also planning to delete a branch go to the command palette and type Delete branch
.
Commit directly in the source panel
What's even great about this extension is that you could directly commit your code in the source control panel, no more need to go to the terminal and type out the command.
There's a lot more features that Gitlens has to offer and I would really recommend watching this (video)[https://youtu.be/C6wMNoe78oc] to learn more about what Gitlens has to offer.
VS Code Tricks
Just like me you might have read or had watched a couple of vs code tips and tricks. and here are some of the things that I found recently that not many articles had not mentioned.
ctrl + space
Useful for insert/replace suggestion. To fully utilize this feature go to system preferences
and find insert mode
and change its value to replace, this makes sure that when we're planning to change something it instead replaces.
word wrap
Ever had that time where you have a long line of code and you would have to scroll just to see the full of it. well, no more need just go to system preferences > word wrap
once you find you just need to enable it.
Wrap tabs
this is a particuarly useful when you have too many files open and you would have to scroll just to see the other files, with this functionality enabled this ensures that you're tab would then go to new line. To enable this feature go to preferences by pressing cmd + ,
or ctrl + a
and type the keyword wrap tabs.
Navigating through the files using keyboard navigation
press ctrl shift e
for windows and for mac cmd + shift + e
to open up explore tabs. you can navigate through the files using arrow and down keys, pressing space
opens the folder or opens the file in a new tab.
Fancy Blnking Cursor
One way to make your VS code prettier is by going the preferences and search for Cursor Blinking
and change it's value to expand and although this is just my preferences it also has a couple of options that you could explore from.
Enable smooth scrolling effect
Another way to make your VS code experience to another level is by going to the system preferences and search for Smoooth Scrolling
and press the check button. This is pretty useful if you're doing some recording.
Pin tabs
if you have a file that's always been used and you don't want it to be closed, vs code has a functionality that let you pins a particular file by simply right clicking on a tab that you want to be pin and find Pin
.
Leverage VS code extensions
I've had a lot of vs code extensions installed in my computer but these are the extensions that I had found to be primarily useful and used daily as a front-end web developer. it had made my experience more better and also happy with using VS Code.
- Path Intellisense: Provides path intellisense to your files.
- Relative Path: Gets the relative path of any file once installed you can start using by pressing the command
ctrl + shift + h
orCmd + shift + h
. - Auto Imports : Finds code completion for all available imports.
Summary
to summarize the points of this article.
- Gitlens for git integrations.
- Make use of VS Code keyboard shortcuts.
- Leverage VS code extensions.