I’m a bit ashamed. I started using Sublime Text more than a year ago, but never got around to learning many of its best features. This is my penance.
First, let’s be clear (and opinionated): if you develop for UI, you probably ought to be using Sublime. Sure, there are the folks who insist that terminal-based modal editors keep them closer to Jesus, or might allow them to someday squash bugs on the production server with their phone, from the top of Mt. Hood, in a blizzard, while making sweet love to an angel. But for more… uhhh… practical… folks, Sublime is the way to go. In particular, UI devs spend so much time working in desktop applications as the point of interaction with designers, product owners, clients, etc. that I don’t think it makes sense to “break your hands” with vim/emacs shortcuts when you can keep yourself comfortable with the Mac OS hotkey paradigm. (YMMV.)
(Note 1: If any of those vi/vim/emacs folks are reading this, Sublime is the first GUI editor to provide a vast amount of what you’re used to, including programmability & plug-ins, and has an extra-special ‘Vintage‘ package to conform to your habits and expectations. It’s also got a chrome-less ‘distraction-free mode’.)
(Note 2: Yes, I know some people just adore IDE’s. But my reading and my limited experience with them leaves me with the prejudice that there is just way too much cruft, and that Sublime has more elegantly included most of their core functionality anyway. That said, I’m prepared to consider WebStorm some day, solely because I keep seeing gurus like Misko Hevery using it in Angular.js demos. But I’ll be surprised if a comprehensive feature comparison reveals much that I could use on a daily basis for small projects I’ve written myself. Then again, I’m not a guru, so YMMV. UPDATE: the Angular-UI team have produced a plugin for sublime that reproduces much of the Auto-Complete and GoTo-Definition functionality that WebStorm had previously offered for Angular. See my post.)
So, Sublime. Sublime is a bit like Photoshop, in that it’s an onion. A software onion. You just keep peeling back layers, and there just keep being more and more and more features hidden in there. So, if you learn your lesson from me, you’ll understand that all those beautiful, time-saving features in Sublime won’t just reveal themselves to you unless you make a concerted effort to go find them. And you’ll go find them. I had my mind blown about three separate times while figuring these out. They’re just invaluable, and will allow you to move around with the fluidity of the grey-beards who use vim, plus some features they only wish they had.
There are other ways to learn Sublime’s features, but many folks (especially those just starting with Sublime) will find their time well-invested in Jeffrey Way’s outstanding and free tutorial, Perfect Workflow in Sublime Text 2. Really, all video tutorials ought to be as crisp, professional, and well designed as that one. (I might actually watch some of them, if they were.) It’s so good, it’s linked from Sublime’s own support page. Most people will easily make back their time investment in a month or two. The whole thing is well over 2 hours of content, including all the plugins, but you can start with the fundamentals in about 50 minutes.
(Foolishly, I skipped ahead to one of the middle pieces of the tutorial, thinking that I already had the basics figured out, then quickly reversed course once I noticed how good his content is, and how many tricks he was already using that I didn’t know. Until now, I had been really pleased with myself for just discovering multiple cursors a while back. <sigh>)
Anyway, I promised you Sublime’s must-use Mac OS features & hotkeys, focused on editing/navigation features. Commit these to muscle-memory and it’ll save you hours. I’m writing this post precisely to help myself do that.
- Show/Hide Sidebar:
⌘-K + ⌘-B
You won’t need your sidebar much, after you memorize these hotkeys. But note the use of
⌘-Kas a modifier prefix. This will recur, and lets Sublime offer many more hotkeys than it could otherwise. It’s like that second set of presets on your car radio.
Cursor Control, Multi-Selecting
Once any string is selected, pressing
⌘-Dwill find the next instance of that string, and insert an additional cursor there, until no further instances are found. (With nothing selected, will first ‘expand selection’ to the word around your cursor.)
BONUS: If you go too far, you can reverse course and deselect the last instance with
BONUS 2: You can modify
⌘-Kprefix to skip the current instance and go to the next one.
Multiple Cursors at *all* matching locations in the current doc.
If you have a multi-line selection, this hotkey converts it to multiple, single-line selections, with a cursor at end of each line. I’ve swapped this mapping with
⌘-L, for consistency (see below).
- Multiple-Cursors via Column-Select:
You’ll just need to try this to get it. Creates multiple selections/cursors in a symmetrical block of characters, without including whole lines, and without needing all of the selections to match, as with
⌘-D. Inserts a cursor at the beginning or end of each selection, depending on the direction you drag.
- Multiple-Cursors (Columnar) by Keyboard:
If you just can’t bring yourself to lift your fingers from the keyboard to get columnar multi-cursors like above, just hold down
CTRL-SHIFT, while pressing UP or DOWN.
- Multiple-Cursors with Additive Selection:
Are the options above too… symmetrical… for you? OK. Believe it or not, Sublime lets you free-select as many additional, totally random, unrelated-in-any-way areas for cursor insertion as you want. Just hold down
⌘and choose them with your mouse.
- Deactivate Multiple-Cursor Mode:
Searches & Quick-Finds
⌘-F, but without all the extra steps, and a find panel you have to close when you’re done. Jumps immediately to the next instance of the selected word. If you haven’t selected anything, it assumes you want whatever word your cursor is in.
This is the same as what I called “Multiple-Cursor-Find-All”, above. Repeated here because of both hotkey and conceptual similarity.
Quick-Finds, but re-using whatever your last search term was (whether it was a quick-find or a traditional find). On my own machine, I’ve swapped the assignments of this and Quick-Find, as I expect to use Quick-Find far more often.
- Incremental Search:
More like ‘modal’ search, as there’s nothing really ‘incremental’ about it. Per the unofficial docs: “The only difference with the regular search panel lies in the behavior of the
⌘-F, the selection jumps to the first instance of your search string, and you have two options: press
ENTERto jump to the next instance, or press
ESCAPEto exit the search panel and keep your cursor at that location.
⌘-I, you can modify your string but
ENTERwill close the search panel and drop you at the first instance. This is good for simply jumping ahead to an editing target you can already see, without lifting your fingers from the keyboard. To advance to the next instance before you close the search panel, use
- Traditional ‘Find’, but Project-Wide:
These commands start from your insertion point and make a selection outward from there. Repeated presses of the key will continue outward.
- Select Whole HTML Tag:
- Select Whole Line:
This works even in multiple selections. (That said, I use
⌘-LEFT/RIGHTmore often in that context.) I’ve customized mine to
⌘-SHIFT-L, to match the other ‘expand selection’ commands.
- Select Whole Scope:
Makes an odd stop at a function’s params before continuing to the whole function.
- Select Whole Indented Block:
- Select Whole Bracket:
Again, I’ve remapped this to
⌘-SHIFT-Mto match the other selections, so all 5 can begin with
- Wrap Selection With Tag:
Just type the tag/element name once it’s wrapped.
- Duplicate Selection:
- Join Selection (into 1 line):
- Swap Selection Up/Down 1 Line:
- Line or Selection Indent/Unindent:
MUCH better than manually inserting tabs.
- Open Goto Anything Panel:
Goto Anything is a mind-blower right up there with multiple cursors. Typing a search string into the panel gets you fuzzy searches and instant previews for any/all of the following:
- Goto File:
Instant access, via keyboard, to any file in your project. Fuzzy search will locate any files with matching names, or even kinda-sorta matching names, and show you an instant preview of the top-ranking match. To see instant previews of other matches, just arrow-down through the list. If a quick look was all you needed, hit
ESCAPEand you’re done. To open and activate the file that’s previewing, hit
ENTER. Close your sidebar, now, and make yourself get used to this feature.
- Goto Symbol:
@operator, followed by a search string, to jump immediately to a symbol in the active file.
- Goto Line:
:operator, followed by an integer, to jump immediately to a line in the active file.
- Goto Text:
#operator, followed by a search string, to jump immediately to that occurrence in the active file.
- Goto Line or Symbol or Text in File:
Yes, you can totally combine all of the above, to go directly to a certain line or symbol in a certain file. Start with the file search string, select the file you want as those results come up, and then add
#to the string to goto line or symbol or free text in that file.
- Goto File:
- Goto Any Project:
- Show/Hide Sidebar:
⌘-K + ⌘-BReally: close your sidebar now and get used to Goto Anything.
- Close HTML Tag:
- Wrap Selection With Tag:
- Select Whole HTML Tag:
- Paste With Indentation-Matching:
⌘-CTRL-VYes, it does seem that Jon Skinner can read your mind. Magic.
- Scroll 1 Line Up/Down:
CTRL-OPTION-UP/DOWNScrolls the view, without moving the cursor.
- Scroll to Center Cursor Vertically in Window:
⌘-K + ⌘-C
- Delete Nearest Word/Subword:
- Delete Line After Cursor:
⌘-K + ⌘-K
- Delete Line Before Cursor:
⌘-K + ⌘-DELETE
- Toggle Commenting on Line/Selection:
- Insert New Comment at Cursor:
- Convert to Uppercase:
⌘-K + ⌘-U
- Convert to Lowercase:
⌘-K + ⌘-L
Swaps the two words or characters on either side of the cursor.
Underutilized OS-wide Text-Editing Shortcuts
Many folks already know this, but we’re after text-editing power here. You can do an amazing amount of text selection and cursor movement from your keyboard in almost all applications, by just using
SHIFT, and combinations thereof, to modify your arrow keys:
SHIFT: Holding down shift and moving the cursor with arrow keys selects whatever text you pass over.
OPTION: Arrow keys move by the word, rather than the character.
SHIFT-OPTIONselects by the word.
⌘: As a modifier for left and right keys, jumps to the beginning or end of a line, and selects to end of line when modified with
SHIFT. With up and down, jumps/selects to beginning or end of document.
Bonus Sublime Optimizations
- For any command that searches downward in your document for something, modifying it with
SHIFTwill search upward instead.
- Dragging a folder onto the Sublime icon in your dock will open up a new Sublime window and add the folder to the project, showing it in the project sidebar.
- If you set it up properly, you can also open Sublime directly from the terminal, and pass it a particular file, or the whole current folder, just as above.
- If you love a shortcut, but not its key-combination, you can easily redefine it. (Plus, just reading through the key bindings file will reveal tons of additional undocumented bindings of varying utility.)
- Auto-complete is a great feature, but I think it’s frustratingly ambiguous that insertion happens automatically on
ENTER, which you might intend simply as a newline character. You can change this to
- There are a ton of other great features hidden in the prefs, so be sure to read all the way through the (well-commented) file. Other new faves include: removing hyphens from the default word separators, “indent_guide_options”: [“draw_active”], and highlight_modified_tabs. (Note: all your changes should be made in your user-settings files, else you’ll lose them on updates.)
- If you want more background on Sublime components and concepts, the community-maintained Unofficial Docs have some good stuff. However, other parts of the unofficial docs are dodgy (like their list of hotkeys).
- And if you want more power when you’re done with just figuring out the text-editing awesomeness: Sublime is fully extensible, and has it’s own package-management system, project build hotkeys, and much more. But that’s a whole additional post. The Perfect Workflow tutorial has good info there.
- As if that’s not enough… Sublime Text 3 is now in Beta. It includes ‘Goto Definition’, project-wide symbol search, and other features which should be a big help in converting IDE hold-outs. Registered users can try it now…
Other great lists of must-use features from around the web:
- 7 handy text manipulation tricks in Sublime Text 2
- 12 Most-Wanted Sublime Text Tips And Tricks
- Sorting lines of text alphabetically with Sublime Text 3
- Easy Color-Picking in Sublime Text