IDE¶
As a computer engineer, a significant portion of my time is spent programming. After using a variety of IDEs I settled on Vim and VS Code, extensively configuring them to maximize my productivity.
Showcase¶
This is what my VS Code configuration looked like when I was still using the setup repository. Currently my configuration looks mostly the same, but uses the Vim extension instead of the Neovim extension.
Vim Keybindings¶
My IDEs of choice support Vim keybindings, which significantly reduces my mouse usage while programming. After overcoming the steep learning curve, I was able to write code much faster.
Here are some Vim learning resources that I recommend:
- Vim Tutorial
- Vim As Your Editor
- Mastering the Vim Language
- How to Do 90% of What Plugins Do (With Just Vim)
I have extensively customized my Vim configuration based on the following configurations:
Vim¶
I use Vim to quickly modify a file from the terminal. I do not use any plugins, opting to use VS Code when I need a fully-fledged IDE. Vim is noticeably faster than VS Code for large files.
Configuration file: .vimrc
VS Code¶
VS Code has great support for debugging, remote development, Git, most programming languages, and much more through extensions. It is also extremely configurable, with its settings and keyboard shortcuts being able to be modified through a UI or JSON file.
To get Vim keybindings in VS Code I use the Vim extension.
You can enable various features in its settings, which include some Vim extensions and using a .vimrc.
I use VS Code's built-in Settings Sync to sync my configuration, but have copied some of my configuration files to my dotfiles repository for your reference:
Resources:
Extensions¶
In addition to the Vim extension and language and framework extension packs, I found the following extensions to be useful:
| Extension Name | Description |
|---|---|
| Edit csv | View and edit csv files with a table UI |
| Git History | View git log, file history, compare branches or commits |
| GitLens | See who committed each line of code and when they did it |
| Live Share Extension Pack | Real-time collaborative development |
| Path Intellisense | Autocomplete filenames |
| Peacock | Change workspace border color to be able to quickly identify workspaces |
| Remote Development | Support for development using WSL, SSH, and Docker |
| toggle semicolon | Ctrl+; to add or remove the semicolon at the end of a line |
| vscode-icons | Clean file icons for the file explorer |
| vscode-pdf | Display pdf file in VS Code |
Quirks¶
Several quirks that I have noticed with my VS Code configuration:
- Undo and redo behavior is different in Vim and VS Code. Thus saving a file, making a change, then using U to undo will not bring the file back to its saved state
- Workarounds: enable auto-saving or map U and Ctrl+R to the VS Code implementation of undo and redo
- "Quick Fix" on Windows and Linux (Ctrl+,) is overridden by my toggle semicolon extension
Software Infrastructure¶
VS Code has some amazing features that can be used to customize and automate your development environment for a project and share it with the project's developers.
Workspace Settings¶
Workspace settings
customize the VS Code configurations of everyone who opens the workspace in VS Code.
Besides the settings.json file, you can add launch configurations,
recommended extensions,
tasks, and much more.
These files are stored in the .vscode/ directory. Workspace settings override user settings.
Example workspace settings: UBCSailbot/docs/.vscode, UBCSailbot/sailbot_workspace/.vscode.
Dev Container¶
Dev container
wrap up your VS Code configuration with your dependencies in a Docker container.
These files are stored in the .devcontainer/ directory.
Example dev container: UBCSailbot/sailbot_workspace/.devcontainer.