These days, my editor of choice is, like many people, VS Code
Ok! Now that the goodbyes are done, let’s talk about my VS Code setup
Those are intentionally not complete, some of the settings I have in my full config files are for things I don’t really use (such as Zen Mode or the Git support inside the editor), default settings that I redefine just to be exhaustive or things that are personal choices outside of the scope of this article (such as if I accept telemetry or not)
My favorite font for coding these days is by far Iosevka. I find the default font weight a bit hard to read on my screen so I put it at 500. I use Fira Code (my previous font) as a fallback for computers where Iosevka is not installed. For both, ligatures are enabled - love those
I disable the minimap. I don’t find it to be useful in any way as I probably don’t work on files big enough anyway. I put the sidebar on the right side, that way toggling it doesn’t change the position of the code. Probably one of the best changes I’ve made over the year to my config funnily enough, it’s really good. I also hide the menu bar because it clash a lot with the rest of the color scheme
I try to avoid using extensions as much as possible to avoid unnecessary bloating and performance issues however there’s so many good stuff available on VS Code that it’s really hard not to overcommit on extensions and sometimes well, a few ms more to start your editor you’re gonna sit in all day doesn’t hurt too much 😅
Auto Close Tag and Auto Rename Tag by Jun Han
So both of those features are actually available by default in VS Code (
html.autoClosingTags for Auto Close Tag and
editor.linkedEditing for Auto Rename Tag) and it works really well!
Unfortunately for both of those the support is limited and so they only work in a limited list of format. Those extensions work in every format so that’s good
Highlight Matching Tag
TODO: screenshot of the extension
This extension highlights matching opening and closing tags. It makes it much easier to see where you are in a file, simple enough.
I pair it with VS Code’s native bracket pair colorization (
editor.bracketPairColorization.enabled). It’s not necessarily pretty, the colors get pretty funky at times but it’s very useful. One day, I’ll customize the colors so it look nicer
Linters and EditorConfig
Additionally, I use EditorConfig for VS Code to add support for .editorconfig files. I really wonder why VS Code doesn’t have support for these natively yet as they are used in a lot of big profile projects, including VS Code itself but oh well
This one I use a lot! It highlights and list every TODOs (and other tags) in your project. It’s really satisfying to see the list of TODOs get smaller and smaller!
It’s heavily configurable, notably you can add as many custom tags as you want. Personally, in addition to the default ones, I added a tag “NOTE” to list every parts that need explanation.
Often, parts that need explanations are parts that should be simplified so much like TODOs I try to reduce the list of NOTEs as much as possible ha!Page last modified Sep 01, 2023