Visual Studio Code

Code is a lightweight graphical code editor managed the Microsoft. It works on most popular operating systems, doesn't require too many resources to run, and has a lot of support in terms of extensions that expand the functionality.

Portions of Code are closed-source and proprietary because they connect to Microsoft services and Microsoft would like to keep developer using their products. That includes things like C# development and Copilot. Fortunately for me, I don't use any extensions that requires Microsoft-controlled code and I'm rabidly anti-LLM coding, so I use a stripped down alterative called VSCodium.

Anything I suggest below works for both Codium and Code equally, though the features in Codium will lag behind Code by a few months. When I show examples, however, I will use codium for the CLI calls but you can easily substitute code without any problems.

Starting Code

The easiest way to start with Code is to point it to the top of your project root, such as //.

$ cd src/allegro
$ codium .

On Windows, you can right-click in the dead space of a folder and choose “Open in Code” and get the same results.

Minimap

A nice feature of Code is that it gives you a “mini map” of your entire document on the right hand side. While this doesn't mean much, I find it gives a suggestion of your flow, including sections with lots of short paragraphs, longer paragraphs, but also places of note such as spelling errors and highlights.

It also lights up the area you can see on your screen and the currently highlighted line.

A screenshot of Code showing the minimap and various regions of the document.

Commands

In Code, almost everything can be done without touching the mouse. For many arbitrary commands, Control-Shift-P will bring up a command palette and let you find the command by typing.

If you want to assign a specific keyboard shortcut to a command, you find the command in the palette, then select the gear icon to the right of it, and assign it a shortcut.

One of the default key bindings is to bind View: Close Primary Side Bar to Control-Shift-0 because the default binding conflicts with the All in One Markdown plugin below.

Extensions

By itself, Code is a very stripped down, low resource text editor. It doesn't do much more than list files in a project folder, open files, and edit text. It starts to shine when you install extensions into the project that give it additional functionality. For a writer, this can range from spell-checking to highlighting trouble words.

Code Spell Checker (streetsidesoftware.code-spell-checker)

Probably one of the most important extension for me, Code Spell Checker provides spelling while you write. This will put a blue squiggly line underneath the text and also but a blue tick mark on the scroll bar to the right.

A screenshot of Code showing a spelling error lined with blue andd the corresponding marker in the minimap on the right.

Project Words

One of the features I spent a fair amount of time adding to the Atom text editor (now defunct) is the ability to add words for a specific project. This is important to me because I don't want to pollute my system-wide dictionary with character and location names, phrases that only make sense in a few places, and other things.

This also allows me to add a word list that is checked into the project that can easily be transferred to another computer.

Unfortunately, this does require just a little custom set up, at least once. To change it after the extension is installed:

A screenshot of the spell settings

  1. Type Control-, to bring up the settings
  2. Search for “spell”
  3. Find and then search for “spell”
  4. In the section “C Spell: Custom Dictionaries” click on the “Edit settings.json” link at the bottom
  5. In the new window, put in the following json:
"cSpell.customDictionaries": {
    "project-words": {
        "name": "project-words",
        "path": "${workspaceRoot}/.config/project-words.txt",
        "description": "Words used in this project",
        "addWords": true
    },
    "custom": true, // Enable the `custom` dictionary
    "internal-terms": false // Disable the `internal-terms` dictionary
},

Given my project layout, I prefer to put configuration things like this into the //.config/ directory, so ${workspaceRoot}/.config/project-words.txt means put it into //.config/project-words.txt.

Commands and Keyboard Shortcuts

When you have a typo, you can move your cursor to the word and type Control-. to bring up a list of suggested words. There are many commands that I find useful.

  • “Spell: Go to Next Spelling Issue and Suggest” which I bind to F8
  • “Spell: Go to Previous Spelling Issue” which I bind to Shift-F8
  • “Spell Checker: Focus on Issues View” which shows all spelling errors in the entire project

EditorConfig for VS Code (editorconfig.editorconfig)

I install the EditorConfig plugin for every editor I use. I recommend it and it doesn't have any configuration settings of note.

Highlight (fabiospampinato.vscode-highlight)

This is a useful extension that lets you highlight trouble words. In my case, I have a tendency to linger too long on the shift key and have a tendency to have double capital letters.

Like the spell check, it requires some custom configuration.

  1. Type Control-, to go into settings
  2. Search for @ext:fabiospampinato.vscode-highlight
  3. Go to “Highlight: Regexes” and click the “Edit settings.json”
  4. Add the following JSON into the “highlight.regexes” section
"([A-Z][A-Z])[a-z]": {
    "regexFlags": "g",
    "decorations": [
        {
        "overviewRulerColor": "#ffcc00",
        "backgroundColor": "#ffcc00",
        "color": "#1f1f1f",
        "fontWeight": "bold"
        }
    ]
},

What this does is highlight any double capital letter followed by a lowercase letter in bright yellow. That also shows up in the minimap.

A screenshot of the highlight function putting “TH” in “THe” in bright yellow

Just (skellock.just)

This lets you run your Just files directly from inside Code.

I bind the “Just: Run Recipe” to Control-Shift-B.

Markdown All in One (yzhang.markdown-all-in-one)

This is a huge extension that makes writing in Markdown much easier. It highlights sections, bolds, and italics in colors. It lets you use Control-I to mark as section as italic (just like Microsoft Word and most other editors) and is generally just a good quality of life extension.

Marky Stats (robole.marky-stats)

This extension gives you a word count at the bottom fo the page and a rough “reading time”. The only thing I don't like about it is that it also includes words in the top matter so I use it as a rough guideline instead of an accurate count.

Profiles

One of the drawbacks of editors like this is that it doesn't know when you only one some extensions and not the others. Recently, Code has introduced “profiles” which will allow you to turn on and off extensions based on what you want. That allows you to create a writing profile verses a .NET development profile.

I haven't had a lot of luck with profiles. More accurately, I ended up going a different route before profiles were introduced and initial bugs turned me off. Instead, I use a shell alias to create an environment that is only for writing and will never have any other extension installed. That way, I avoid the overhead of Python, Rust, or C# extensions and I can use a dedicated theme so it is easy to put me in a writing frame of mine.

$ alias
alias code-writing='codium --extensions-dir $HOME/.config/codium/code-writing/exts --user-data-dir $HOME/.config/codium/code-writing/data'

Obviously, if you only use Code to write, none of this is needed.