Vimnastics: Writing Repetitive Markup in Vim

If you’re anything like me, you can’t stand doing repetitive tasks. Especially repetitive typing. Repetition is for robots.

The other day, I found myself needing to type out a select box filled with lots repetitive options. It looked something like this:

<select>
    <option value="100">$100</option>
    <option value="200">$200</option>
    <option value="300">$300</option>
    <!-- and so on... -->
</select>

The options I needed to type went all the way from $100 to $2000. Normally this would be a pain to copy, paste, edit manually, and check for mistakes. Luckily, I found a Vim trick to help me out. A quick macro can do the work for me.

Note: This is the part where I warn you that this post is for Vi/Vim users only. It won’t be of much use if you use a different text editor.

Let’s start off by typing our select element and our first option:

<select>
  <option value="100">$100</option>
</select>

Easy enough. But I refuse to type any more <option>s. This is Vim, for crying out loud. Let’s write a macro to copy that line and increment those numbers by 100. If you’re at least somewhat familiar with Vim, this is much less daunting than it sounds.

Make sure you’re in normal mode, position your cursor on the first <option>, then follow these keystrokes:

# vim normal mode commands
qa              # start recording our macro in the “a” register
yy              # yank the current line
p               # paste the yanked line
/\d<return>     # search for the next digit (1 in this case)
100<ctrl-A>     # increment 100 times
n               # repeat the last search (\d)
100<ctrl-A>     # increment 100 times*
q               # stop recording our macro

* You may be tempted to use the . command here to repeat our last incrementation. Don’t do that — it behaves strangely inside of macros.

Following along with these steps will create our next line of code, as well as store our keystrokes for repetition.

Now we’ll type @a in normal mode. This runs the macro from the “a” register, which yanks, pastes, and increments, all in one go. If everything went according to plan, our macro will spit out our shiny new line of code, incremented numbers and all:

<select>
  <option value="100">$100</option>
  <option value="200">$200</option>
  <option value="300">$300</option>
</select>

Sweet. Let’s run it a few more times. Try running 4@@:

<select>
  <option value="100">$100</option>
  <option value="200">$200</option>
  <option value="300">$300</option>
  <option value="400">$400</option>
  <option value="500">$500</option>
  <option value="600">$600</option>
  <option value="700">$700</option>
</select>

Typing @@ ran our last-used macro. The 4 tells Vim to do it four times. If everything is looking good, you can run the macro as many times as you’d like to fill out your select box.

I’ll be honest—it’s not very likely that you’ll be able to use this exact macro in practice. However, I hope you’ll be able to dissect it, learn from it, and come up with your own custom Vim macros to remedy the misery of writing repetitive code.