I hate IDEs. I always have, I probably always will. I don’t always want to edit a file that is in a project and I don’t like any of the ‘project-less’ kludges that are out there. So for the majority of my programming career, I’ve used “program editors”. Programs just smart enough to know that I’m working in code and give me tools to do that properly, but not so smart that they get in my way. For the last few years I’ve been a huge fan of “Sublime Text”. I’ve owned a license at the last three places I’ve worked and even maintained my own personal license. All that changed last year when I became one of the last developers on earth to notice VS Code by Microsoft.
Back in April, since I found myself with some time on my hands, I decided I would spend a day actually learning how to use VS Code. Maybe if I had bothered to do that with Sublime Text, I’d still be using it. but that’s a discussion for another day.
Once I got the basics setup, I started exploring Extensions. I’ve loaded more than 40 of them now at one time or another but I’ve paired my list down to my “Essential 12”. Here they are for you.
WAIT! Before we get started though, let me describe my setup.
I use Windows 10, but I use the Windows Subsystem for Linux (WSL) for all of my development. My production servers are all Linux (CentOS if you MUST know) All of my projects are stored on either GitLab or GitHub. You may be using MacOS or Linux, but since all my development is Linux, almost everything I talk about here will apply.
“Absolutely must have or it’s not worth using” extensions
This is the grandaddy of all the extensions. This is what made VSC actually useful to me on a day to day basis. It was only released in May, so I have the least amount of experience with this one but trust me, this is the ONE you have to install if you don’t install anything else.
This is actually an extension pack, not a single extension.
- Remote – WSL
- Remote – Containers
- Remote – SSH: Explorer
- Remote – SSH: Editing Configuration Files
The first three are the secret sauce. They allow you to edit files natively inside of the WSL, inside of running Docker containers, or on any machine that you can ssh into.
From a command prompt inside the WSL (I use bash so I’m going to say bash prompt form now on. You can translate into your favorite command prompt) developers can open a single file or a directory by simply typing
This will open VCS, instantiate a running instance of it’s server piece inside the WSL, and open the current directory ready for us to begin working.
It’s that middle task that makes the magic happen. VSC Remote Development Extension Pack actually has a server piece that it runs in Containers, WSL, and over SSH to allow it to seamlessly manipulate files and directories.
This group of extensions also integrate the remote file system into VSC so you can use File->New/Save/SaveAs/Delete etc on remote systems, WSL, and inside containers. That did away with the need for an extension solely for that purpose.
The fourth item on the list above is a convenience extension that makes editing remote ssh config files easier by giving keyword intellisense and syntax coloring.
BONUS: When you open the terminal window while connected to WSL, a container, or SSH, you get a command prompt in that environment. This means a bash shell in WSL for me, not the PowerShell. (which I still hate) The shell it presents is better and more compatible than any shell I’ve used in Windows so far. If you want, you can even setup forwarders. This could be your complete ssh solution if you so desired.
If you don’t have this extension, you are missing the power of VSC, especially if you work in Win/WSL.
Since the vast majority of my work in VSC is PHP code, I wanted more than the basic intellisense that is built into VSC. (It is actually recommended that when you install this extension, you turn off the native PHP intellisense) There are a couple of Extensions that do this, I tried them all and this is by far the best and least intrusive.
At least one of them tried to format things as I pasted them in. This caused me to have to do a lot of correcting, removing spaces, and reformatting before I could use the code I just pasted in. This plugin does not do anything too wild. It gives you basic keyword intellisense, tab completion, advanced searching, etc. One of my favorite things about this extension is that if you click on a use statement, it will locate the file that class is defined in and open it for you.
As I said, this plugin does not attempt to format your code for you. It recommends that you use the PHPCS extension for that. (Another reason I love it)
“Sugar coating that make the tool very nice to use” Extensions
This one really should be in a category all it’s own called “This is so cool” Extensions. Polacode allows you to create “snapshots” of your code. You activate it, you highlight the code you want snapshoted, and you click the shutter button. BOOK, you’ve got a png of your code ready to share on social media or incorporate into your next slide presentation. It really is that simple. (Well, when you click the button, it asks you where to save it and what to name it. Other than that it’s that simple.)
Outside of the Remote Development Extension Pack, this is probably the coolest extension I use.
If you do want your code auto-formatted, this is the extension to use. You have complete control over which standards to implement and those can even change on a project by project basis. If you use phpcs in your development process this is a must-have extension. If you install it though, take the time necessary to configure it properly for your base configuration and then modify that as needed on a per-project basis. Since I work in several communities, this allows me to say that my base config is PSR1/1, but my WordPress plugins adhere to the WordPress coding standards. (Mostly) The investment of 30 minutes to get everything setup and configured is time well spent.
Some of the work I do requires views and when I use a view, I always use Twig as my templating engine. This extension provides syntax highlighting and hovers for my twig templates. Syntax highlighting might not sound important but once you get used to it, and then you open a file that does not have it, you begin to wonder if your program is broke or if you’ve suddenly been transported into a black & white movie.
Anyone who has ever received an email from me (or read one of my blog posts that pre-dates spellcheckers built into browsers) knows that I seriously suck at spelling. Even when I do have spell checkers they rarely work in code because
$somethingImportant will never pass a spell checker. So I have this plugin. This one is hit or miss. It almost always identifies misspelled words in strings or comments (YEA COMMENTS!) but it used to be that I could have it fix them. That stopped working in the latest update. Hopefully they get that fixed soon.
First, you should not have a lot of nested IF and FOR statements. Down that road is madness. However there are a lot of times where we have function calls nested inside other function calls, nested inside an IF. When you do find yourself in that situation, you want this plugin. This plugin assigns a color to each pair of brackets, braces, and parentheses. This makes tracing down missing ones trivial and helps you understand the actual nesting of your code.
“You may not needs these but I sure do” Extensions
I write a lot. Of late I’ve been writing two books “Using the WordPress REST API” and “Extending the WordPress REST API”. These books are written in MarkDown and stored in private repos on github. (Leanpub refuses to support GitLab, my preferred site. ) Most of the time, MarkDown is easy to do, however, there are some rules that have to be followed. This plugin keeps all of my markdown clean and parse-able.
JSON is the lingua franca of APIs. It is heads and shoulders better than XML in every respect except one, readability. XML is human readable. This plugin basically does what PHP’s
json_encode($payload, JSON_PRETTY_PRINT) does. It puts linefeeds where we need them and indents where we need them. It also does syntax highlighting and linting for JSON. If you find yourself pasting JSON into a text editor and making it readable by hand, you want this extension. If on the other hand, you prefer XML, well, you have problems beyond the scope of this article. :)
Again, another writing tool. Not even a tool, just a simple little plugin that tells me how many words are in a given MarkDown file. It is not important if you don’t do a lot of writing, but without it I couldn’t tweet out my “how many words I wrote today” tweets.
“I’m keeping an eye on this” Extensions
I’m an old database programmer. I still hand code every line of SQL I write. So I am always looking for new ways to access and manipulate data. I had high hopes for this extension because it looked like it would give me a powerful command line to access my database. To date I’ve not been able to do anything other than get a list of tables on a server.
Still, I have not uninstalled it. Every time there is an update, I try again to see if it is working better.
That’s it, that’s my current extension list. I hope I’ve introduced you to a new friend or two. If you are new to VS Code, I hope I’ve given you a few new toys to play with.
Until next time,
I <3 |<