Kinanee SamsonIn todays article i am going to be sharing with you some of the visual studios extension that i personally use for work. If you don't use vs code, there's nothing wrong 😐😮, but vs code is like the superman of text editors and it can allow you to be 10x more productive. Vs code is a text editor built by Microsoft, it is free to use and you can add extra functionality to it via extensions. You can download it from here. Let's dive in. If you already know or use any of these extensioms then feel free to skip it or even better you can extend the list with your own custom extension that i did not put on this list, i would love to see many extensions that i don't already use.
Bracket pair Colorizer
This extension just ensures that matching pairs of opening and closing curly braces have the same color, if you were nesting codeblock after code block, each code block would have their own pair of matching colors to let you know which particular block you are currently in.
Bookmark
This another handy extension i use a lot at work, this extension alloes you to mark a line of code as a bookmark then you can just jump to it much later, it behaves the way an anchor element behaves when you are linking to different sections on the same page, it saves me from manually scrolling through a long file especially one that has over hundreds of lines, i just bookmark the lines on the code that I'm working on then i just right click and then select jump to next or jump to previous 😅.
Git Lens
I cannot understate the importance of this extension 😍, it allows me to get a lot of information about version control with git, on a single line you can see who changed what and when they changed it. It also has a UI that you can use to compare the changes made on a file. It has a menu that gives you access to more exiting features, if you don't like using the terminal for git/github, then gitlens has a sinple UI that can allow you to
- stage files
- Commit them
- Add a remote repo
- Push code to a remote repo
- Pull code from a remote repo and lots more and the icing on the cake is that you are still in vs code.
REST Client
This is another tool that makes software development much more easier, if you are a backend developer then you have some form of app or platform you use to test your API when you don't have a frontend, i normally used Postman but since i met REST client i forgot about Postman 🤐. This extension allows you to make HTTP requests from your editor then you see a UI where you can see the response from the server, and you don't have to leave your editor all this while 😋.
php server
If you still work with php like i do 😐🤧 then this extension is for you, it allows you to spin up a php server right in vs code, it works much like XAMPP and most of the time when am working on simple projects or i just want to test a new script, i just go ahead with the php server rather than using XAMPP
Auto Tag Rename
This is another cool exension for vs code, most of the time im always in a hurry and i hit <h7>goof</h7> Who does that 😮??? But thank God fir this extension, i don't have to go and change the opening tag and then come and change the closing tag. Once i start changing the opening tag, the closing tag also automatically updates to match the change in opening tag.
Chrome debugger
This is an extension built by Microsoft for Microsoft visual studio code 🙄, it allows you test you javascript code inside vs code 😎, although it makes use of chrome via its chrome debugger protocol. One thing i like about this extension is that you can defins breakpoints in your code where the debugger should kind of like pause at 🤓. This is cool for working with deeply hidden or nested bugs so you can pin point the exact place the error is originating in.
Live Server
This is another great vs code extension, i use it for simple HTML and vanilla JavaScript or jQuery projects. It has a hot auto reload feature, so once you serve your file with this extension it watches that particular file or others it is linked or in the directory, and once you make a change in any of them it automatically refreshes the page 😎 Awesome right?? Now you have been saved a lot of save and reload
MySQL Client
Since m a php developet at work, it means i also have to use MySQL 😓😞. Although i like SQL and the way you organize data in a RDBMS, i prefer working with Objects. That said this extension allows you to make a connection to a MySQL database directly from vs code, so celebrate becaise if you add this to the php server, then you can kiss XAMPP goodbye😘 or not? I still use XAMPP though 😂
Better Comments
This extension allows you to add comments to your code like a god 🙄, basically each comment have a specific color that makes it much more human friendly, readable and fine tuned to the code or logic you are trying to explain.
That's it for this article today, i hope you find an extension here that increases your productivity as a developer, and even if you don't please feel free to add a few of extensions that you use personally that's not already on this list i will be glad to know about one or two vs code extensions i don't know about.
