Codementor Events

Writing code fast in Sublime Text

Published Jul 28, 2017
Writing code fast in Sublime Text

I am a big advocate of leveraging tools to help me do my job faster, and a big part of that is knowing how to utilise the power of a text editor/IDE to speed up day to day tasks.

However, I am not a fan of:

  1. spending hours configuring things
  2. memorising hundreds of keyboard shortcuts
  3. having to do without when away from my machine

A big advantage is being able to jump into a default setup and have as few of a foriegn machine's quirks interupting my flow.

I am a big fan of Sublime Text. I don't think it's the be all and end all of text editors, and I'm certain I could write code faster if I invested the time in Vim, but it simply doesn't meet any of my above criteria. Yet, on a day to day basis, I see people doing boring repetitive tasks manually in Sublime, on a computer, a machine designed to do boring repetitive tasks for you.

Multiple cursors

I don't know how I lived before multiple cursors. Using multiple cursors has sped up my workflow by a factor or 10-20. And I am of the opinion, that you can get 90% of the way there in terms of writing code fast using this killer feature alone.

One commands to rule them all

So how do you do it? Just select a piece of text and press ⌘+D to find the next occurence. Simple, right?

Traversing with multiple cursors

An important skill to master to make multiple cursors as useful is learning how to traverse your document whilst using them.

You have a number of options available for complicated selections, but the main things I use are simply:

  • Ctrl+Left/Ctrl+Right move one word left/right
  • ⌘+Left/⌘+Right move to start/end of line

They're intuitive, easily remembered, and as you' expect, can be simply combined with Shift to select text.

Additionally, for manipulating the selections I use:

  • Cut line/selection(s): ⌘+X
  • Duplicate line/selection(s): ⌘+Shift+D

So taking my example, this is how you would change the latter portion of the method definition – using Ctrl+Left/Ctrl+Right – despite the fact there are a different number of words each of different lengths.

Note that whilst the username line gets out of sync because it has one less word, its easily remedied by moving a few characters back, and then reselecting "populated".

Copy & paste selections

Another killer feature of multiple selections is that Sublime Text knows how to handle copying and pasting them.

Simply grab the bits you want, exit multiple selections (with Esc) and paste it elsewhere, or match the number of selections (in this case: 3) and paste into another multiple selection – super useful if you've got several things to name:

Alignment

Another thing I often find myself doing is lining things up for readability, now whilst Sublime Text won't do this out of box, Sublime Alignment can.

Now alignment is as simple as using multiple cursors, then hitting ⌘+Alt+A.

In fact, if it happens to be equals that you're aligning, you needn't even use multiple cursors, just ⌘+Alt+A on a selection.

Dealing with numbers

Another thing I often find myself doing is numbering things, which is pretty laborious done manually.

Again, Sublime doesn't have anything for this out of the box, but you get a lot of the way there with the Increment Selection package.

Simply set up a multiple selection, open the Command Palette (⌘+Shift+P), and look for "Incremement selection" – this will insert 1-N into each cursor, or if you've selected a number, it will increment up from the first value. Alternatively, use the shortcut, ⌘+Ctrl+I

Permutations <small>(reverse, shuffle, sort and unique)</small>

If you're anything like me, unalphabetised lists drive you nuts. Fortunately, there are permutation commands to help you out for both lines and selections – search for any of the above in the Command Palette (⌘+Shift+P) or just look for "permute".

Case sensitivity

If you're in need of case sensitive selections, simply set find/replace (Ctrl+F) into case senstive mode.

Note you can also jump straight into multiple selections by hitting find all (and it works with the regex option too).

Additional selections with ⌘+Click

If all else fails, and you're struggling to get the selection you want, you can always reach for the mouse, and simply ⌘+Click to add in extra cursors.

Summary

I hope this helps you get started with multiple cursors, if you're overwhelmed, just start playing with ⌘+D and move from there, it's can be tricky to get your head around at first, but once you've got the hang of moving around your code with multiple cursors the sky's the limit.

If you have any questions/suggestions, do submit them in the comments.

Discover and read more posts from Steve Lacey
get started
post comments2Replies
Juraj Dobrik
7 years ago

Have you tried writing code in PHP which does outputs definitive vanilla js code? It would be nice to read article about it.

Steve Lacey
7 years ago

I’m sure we’ve all used PHP to populate a few JavaScript variables, but if you’re talking about generating JavaScript with PHP then no, and I don’t recommend it