DEV Community

Cover image for From VSCode to Vim... and Back?
Jonathan Higger
Jonathan Higger

Posted on

From VSCode to Vim... and Back?

How a plummet into the vim rabbit hole resulted in a massive productivity increase

Part 1 Why Vim???


My Background
I am a full stack developer with a background in chemical engineering and being a lifelong musician. While in college I learned nothing valuable about workflow or productivity. Then when I became a student at flatiron, I got to witness experienced engineers with well-developed workflows. I realized quickly that I needed to become quicker, but unlike a lot of my instructors and friends, I became a little bit obsessed with workflows. I think the inner musician in me loves playing with keyboard shortcuts and constantly learning new things about features. I even built an app to increase my typing speeds as my capstone project.

Check it out at doomtyper, a doom themed typing test that I put together using VueJS and Rails.

Sparking my Interest
I started getting interested in vim when my lead instructor at flatiron school would program in vim right in front of us newbs. Every day he would show off his speed in an editor that literally ran out of a terminal. The more I learned about vim the more fascinating it became, here are the things I found really interesting about it.

That being said, I knew that learning vim would be tough, and on top of that, I had a whole lot of important things to learn first in order to make myself a more valuable developer. So for the time being I wanted to focus less on my code editor and more on my code. In hindsight that was a pretty great decision. There was one small caveat to that though...

Pretty early on into my Bootcamp, I got a mechanical keyboard called an Anne pro 2, that was programmable. As a 60% keyboard with no arrows, I decided that I would use "HJKL" (The vim directional keys ⬅️ 🔼 ⬇️ ➡️ ) instead of the standard WASD choice. Fairly soon using this game, I was extremely comfortable using vim arrows, and I would be happy with that level of vim-ery for about 5 months more. Already from that alone, I believe I saved a ton of effort. I didn't realize how much of a pain in the butt it was to have to move your hand to get to arrow keys until I didn't have to do it anymore. To this day if my press caps lock on my programmable keyboard, I am in a function layer that remaps hjkl to left up down right.

When I took the Plunge
After being an instructor at the Bootcamp that I taught at for a few months I was feeling pretty comfortable with my place in life.
To be quite frank, I was on a two-week break from everything and got really bored. I bought a subscription to Vim Adventures, and at that point, the stubborn child gamer in me felt like I had to beat the freaking game. After finishing, I decided to psych myself into ditching VSCode for vim, mainly because I had worked so hard to get through that game. I validated my decision logically with the following points of note.

  • Vim comes from vi which is one of the oldest text editors to date. All these years later people still use it.
  • I had been told that vim was much faster than VSCode
  • You never take your hands off the keyboard
  • Vim is basically installed on every computer, so you can use vim anywhere that you are ssh'ed into
  • I wanted a stupid reason to feel superior to everybody around me

Little did I know what I had in store for me

Part 2... The Struggle Bus


Which Version of Vim do I get?
After finishing vim-adventures, I felt like I knew all the important vim TEXT EDITING commands, but still couldn't really navigate my way through a project. I figured the only way I'd ever really get good at it was to just start making projects using vim. So I had to download vim. Sounds simple right?

This is where I met my first hiccup. Turns out there is a shitload of options out there. Here are some of them to name a few.

  • Mac Vim
  • Vim
  • SpaceVim
  • NeoVim
  • DOOM Emacs (Emacs with vim bindings)
  • NeoVim nightly

On top of this, there are also a couple of vim-ey things that all good vim users I know have.

  • TMUX
  • ranger

And then when you do all that, turns out there's practically an infinite amount of ways that you can configure all of this stuff. Ultimately after doing my research I decided to use the following setup, which turned out to be a VERY time-consuming decision.

  • Neovim nightly ( a version of vim that is technically still in Beta)
  • TMUX

It took me a full late-night to be able to properly get the beta version of Neovim Nightly installed onto my Mac. But there was supposed to be (and they're definitely are) some cool features on it.

  • Lua Configuration Support (Which I never used)
  • Advanced Language Server Support ( I definitely used this )
  • Ranger integration with picture support ( Which I never used )
  • Treesitter (Which I never used)
  • Floaterm a floating terminal inside of vim( Pretty great, but buggy as hell)
  • COC integration (an all in one tool based on language servers, a technology I would later learn was invented by the VSCode team)

The Struggle bus
These cool features were not free, and I didn't really understand what half of them were. I honestly found out about them through forums from people talking about how they configured their nvims. Unfortunately to be able to use literally any of these features I first had to learn.

  • vimscript
    • to learn how to configure settings properly
  • What the hell a language server is
    • to learn how to get good code coloring
  • What plugins are out there to help me do the thing that I already know how to do.

Long story short, I had a steep learning curve to get through and alot of configuration to do. So every morning I woke up. VIMMMMMMM. Go to Sleep VIMMMMMM. My girlfriend would wake up in the middle of the night to me uttering the name of my one true mistress... VIMMMMM( This is a lie I'm single and lonely). I was obsessed and needed to be, in order to put up with all the bullshit associated with getting up to speed.

Every Day I would write new sticky notes with shortcuts to remember. I would spend at least 1 - 2 hours every day tinkering with my vim configuration files, and I would butcher the classes that I would teach because I was so slow at vim it was unbearable.

The pinnacle of my struggle bus was when I taught a class using vim, with the very same instructor that showed me vim in the first place watching me. I completely choked, forgot everything that I ever learned about vim, and about coding, and my brain exploded in front of 10 students and my vim mentor. BUT DID I GIVE UP????? FUCK NO!!!!

Part 3... I CAN VIM NOW


Moment of Clarity
One day I'm teaching a class, and a student tells me to slow down. Wait for what? I've been struggling with vim for so long, I didn't think it was possible for me to actually go fast at this. While simultaneous being a sign of terrible teaching habits, I'd realized that my obsession with vim had finally started to pay off. I was now unintentionally going too fast for other people... Holy CRAP VIM IS AWESOME.

VIM COMPETENCE FEELS AMAZING
Now that I'm confident in my abilities, I'm flipping between files. I'm learning new shortcuts every day without stretching my brain too hard. I'm getting faster every time I use my computer. I can now talk shit about anybody that still uses nano. Life IS GOOD!!!
Here are some things that I can do way faster than ever before:

  • flip between files
  • edit text
  • run commands on a floating terminal
  • open every part of my code editor with my keyboard
  • Move cursors around seamlessly
  • configure my text editor for customization
  • organize configuration files

Life Is Still NOT Perfect
As fast as I am at vim. Some things still kind of suck. For example, now that I'm used to vim bindings, it becomes annoying to work in a word document. I keep hitting escape, and the truth is I mainly edit markdown files anyways. So why not just do that in vim?

Turns out that in vim, there are all sorts of weird things that begin to happen with word wrap when you start editing. For me, I had to go on an hour-long information binge to figure out the best way to handle these things. On that rabbit hole I find a few ways to fix my problem:

  • I could change word wrap settings in my vimrc
  • I could download a cool plugin called Goyo that lets me edit documents easier
  • I could download another cool plugin called vim-pencil that gives me special text editing features when I edit documents

Ok not too bad, I just have to install a couple of plugins, and we're good to g...
Oh shit, each of these plugins has a list of commands I have to either remember or configure... Fuck
Let's tack a few more sticky notes to my monitor and we should be good to go..... Fuck
Turns out that Goyo's recommended settings interfere with some other settings in my vimrc.
OK finally got it figured out but now that's an hour of my day gone.

I think this is more because I was in the nightly(beta) version, but I also kept experiencing terminal crashes, and in general I didn't enjoy the experience flipping between terminals on TMUX or Floaterm half as much as I enjoyed the VScode terminal. Simple, elegant, a bit slower, but reliable, and I need that extra time to think sometimes anyways.

Part 4... VSCode With VIMBINDINGS??????


If you love vim, please stop reading here. I already know I will be scolded completely and utterly for this segment

VSCode with VimBindings works extremely well
In VSCode all you need to do is go to the plugin manager, search for vim, click on it, and you are pretty much good to go. Almost everything awesome in vim works or can be configured to work in VScode.
Right off of the bat, you get the following features.

  • Standard Vim Bindings
  • Some basic use vim plugins
    • sneak
    • easymotion
    • surround
  • gd, and gf, go to definition and file respectively with no issues

But in my opinion, unlike vim, everything that isn't just text navigation just works smoother with less configuration. If you need to download a plugin get it from the store. You can even configure leader keys to trigger VSCode commands that come with plugins. For example <leader>ss is save, <leader>\ is show error for me.

A few things that I can very easily do in VSCode that I can't do in vim are:

  • Drag and Drop files to my browser
  • Install plugins with a button click
  • Run jest tests with visual cues in the editor
  • Run a debugger without a shit ton of debugging

The Downsides

There are three main downsides to using vim VSCode that I can think of.

  • Not being able to open files inside of the terminal means more window management through your Os
    • Usually, OS doesn't handle window management as well as IDE's do
  • Less configurable in general
    • I think because of the nature of how vim is written, its code is meant to be played around with. It seems much easier to create your own custom things than it would be on VSCode. It is easy to customize VSCode, but not to the same level of Depth
  • VIMWIKI is my favorite plugin I've ever used.
    • I will still use neovim every single day for this plugin alone. It is just the most convenient way for me to take notes in an organized fashion. I've tried VS Code Notes plugins and nothing will ever compare. #vimwiki4lyfe

Summary


Vim was a fucking awesome rabbit hole to go down, after coming out the other end I feel WAY faster than I did before. I also have a much better understanding of all the moving parts of IDE's that we take for granted. More coming on some of those. But if you are someone who is thinking about going down the vimhole, I say fucking go for it! Worst comes to worst, your girlfriend leaves you, or you get so obsessed with it that you neglect your child. More than likely you will get obsessed for a little while, learn a lot, and develop great habits!

Feel free to reach out to me if you have any questions about what my journey was like!

Top comments (0)