In less than a year, the Sublime Text 2 code editor - available for Mac, Windows, and Linux - has skyrocketed to becoming the editor of choice for a huge number of developers. How come? Well, it's a sophisticated editor, with lightning-fast speed, an incredibly vibrant plugin community, easy configuration, Vintage (Vim) mode, multiple cursors - the list goes on.

If you've yet to make the switch, out of some sense of loyalty to your current editor of choice, give me twenty minutes, and I'll convince you!

Please note that this article, for convenienccsse and readability, will exclusively use the Mac-specific keyboard bindings. Refer here for the equivalent Windows/Linux versions.

1 - Multiple Cursors

Let's begin with the feature that will blow your mind: multiple cursors. A note of caution: once you experience the flexibility of having multiple cursors at your finger tips, you won't be able to go back to the old way.

Imagine that you need to change every occurrence of the word, myMethod, to newMethod. Traditionally, you might perform a search and replace; however, in Sublime, it's much easier. Simply place the cursor within the word, and type Control + Command + g. With this keystroke alone, you have now selected every occurrence of myMethod, and have multiple cursors at your finger tips. Change the text, and watch all of them update! Jaw dropping, right?

Alternatively, you can press Command + d repeatedly to incrementally select each additional occurrence of the word.

2 - Command Palette

Sublime's command palette is a God-send for those who prefer to touch the mouse as little as possible (more on that shortly). This palette allows you to run countless commands, such as changing the syntax type for the current document, installing plugins, and searching for snippets, to name a few.

To, for instance, change the current syntax highlighting for the current document from, say, HTML, to CSS, press Command + Shift + p, and type "css." The option "Set Syntax: CSS" should now display. Hit enter, and you're done! Note that you can take advantage of fuzzy searching here; as such, you needn't type the entire word.

Memorize this keyboard command and use it often.

3 - Package Control

Created by Will Bond, Package Control is a powerful package manager that allows you to, from directly within the code editor, install any package (or plugin) that you can imagine. Need Zen Coding? Install it in three seconds. What about Prefixr support, or CoffeeScript syntax highlighting? It only takes a couple keystrokes to setup. No more scouring the web for the right plugin, and then researching where to install it.

To install Package Control, visit Will Bond's site, copy the snippet of code provided, return to Sublime Text, press Control +`, and paste the snippet in and restart. You're done!

Let's install Zen Coding. Open the command palette (Command + Shift + p) and type, "install." Once you press Enter, Sublime will provide a list of all the various plugins that are available to be installed. Search for Zen to bring up "Zen Coding," and hit Enter to install it. Yep - it's that easy! To confirm that it worked, in an empty HTML file, type ul>li*4 + Tab. Tada!

4 - TextMate Themes

It's likely that you Mac readers are currently using TextMate. Luckily, Sublime Text offers full support for TextMate themes. This means that, yes, your custom color scheme can be migrated over to Sublime Text without an ounce of configuration. Simply drop it into your "Packages" directory as is.

5 - Nettuts+ Fetch

How many times have you manually downloaded, for example, HTML5 Boilerplate, or the jQuery library? That's wasteful; wouldn't it be easier if we could run a quick keystroke and instantly download them to the current project? Of course it would! Nettuts+ Fetch is the solution.

Install it through Package Control, and then search for "Fetch: Manage Remote Files." This will display two objects for fetching single files and packages, respectively; two have been provided for you.

To test it, create a new file, search for "Fetch" in the command palette, choose "Single File -> jQuery," and watch the latest version of the library instantly be added. Next, try installing an entire package, and be amazed.

6 - Goto Symbol

Visit any class or list of functions that you have available, type Command + r, and you'll be presented with a list of all the symbols on the page. Notice how we use the @ symbol to view the methods.

As an example, if you're viewing a PHP class, Command + r will list all of the method names. You can then use fuzzy searching to instantly move to the desired method.

When we combine this with Sublime's instant file switching capabilities, this command becomes particularly helpful. Imagine that you need to edit style.css, and, specifically, the .box class within that file; type Command + p, style@box, and you're there!

7 - Prefixr

Prefixr is a web service that automatically applies the necessary CSS vendor prefixes to your stylesheets, so that you don't have to remember which vendors to use for any given CSS3 property. The Prefixr plugin brings this functionality directly to your editor!

Once you install the plugin through Package Control, select the contents of your stylesheet, and trigger the plugin by typing Control + Command + x. Voila! Your file has instantly been updated. Use the official syntax, and let Prefixr figure out the vendor-specific requirements.

8 - Advanced New File

The less you touch the mouse, the better. Unfortunately, by default, creating a new file in Sublime Text can take a bit longer than we'd like. The "Advanced New File" plugin, which can, as always, be installed through Package Control, fixes this.

Once installed, type Command + Option + n, and you'll see a new panel pop up at the bottom.

What's fantastic about this plugin is that you can also create files within folders that do not yet exist. Perhaps you need to create a new scripts.js file, but you haven't yet created the js directory. That's okay; the plugin will know to create the folder if it does not yet exist. Simply type the full path to the desired new file, and you're good to go.

Let's create a new jQuery.js file within a js/libs directory that has yet to be created; Option + Command + n, js/libs/jquery.js, save, Command + Shift + p, "Fetch", "Single File", "jQuery." We've now, in seconds, created a directory tree, and downloaded the latest version of the library.

9 - Vintage Mode

Should they desire to do so, Vim users can easily migrate to Sublime Text, thanks to its optional Vintage mode. To enable it, edit the "Default Preferences" file within the Preferences menu, scroll to the bottom, and remove the "Vintage" item from the ignored_packages array.

Now, press Escape, and you're in command mode! You'll find that Sublime's Vi keybindings are quite accurate!

10 - Native Snippets

Each snippets in Sublime Text refers to a single file, and allows for tab completion and default values. To create a new snippet, choose "Tools -> New Snippet". In this new file, you can, within the <content> tag, insert your snippet. You also have the ability to select a tab trigger and scope, which ensures that the snippet is only accessible from within a specific file type.

Save the file with a .sublime-snippet extension, and test it out!

11 - Versioned Snippets

While Sublime's native snippets certainly get the job done, for larger snippets, I prefer to take advantage of GitHub Gists and version control.

Begin by installing the "Gist" plugin through Package Control. This will now give us a handful of new options in the command palette.

When you attempt to create a new Gist, you'll find that you first need to provide the plugin with your GitHub credentials. I recommend that you create a special account specifically for your snippets. Once you do so, set the credentials, and try again. Once you've created a handful of snippets, you can list them through the command palette, by choosing "Gist: Open Gist."

The best part is that, when you fork existing snippets through gist.github.com, they'll automatically be available to you in Sublime Text - plus, free version control for your snippets!

12 - Build Systems

Sublime's build system allows us to apply keybindings, which can be piped through to external programs, such as CoffeeScript, Sass, Grunt, and more. This means, rather than switching to the Terminal to run your build command, you can accomplish the same thing from directly within the editor.

Let's use CoffeeScript as an example, since it's quite popular these days. Begin by creating a coffeescript.sublime-build file within your "Packages/" directory. Next, paste the following code in:

{
    "cmd": ["coffee","-c", "$file"],
    "selector" : "source.coffee",
    "path": "/usr/local/bin/"
}

While there are multiple options available to us, we'll stick with these three for now. cmd specifies the command that should be executed, along with any arguments and flags. In this case, we're running the current file through the CoffeeScript compile command. Secondly, path is only necessary if CoffeeScript is not installed in your base path.

Once you've saved the file, a new optional will be available through "Tools -> Build System." Choose "CoffeeScript," and, now, when you run the "build" command with Command + b, the current CoffeeScript file will be compiled!

Addy Osmani has a fantastic article on Sublime Text's build capabilities.

13 - Distraction-Free Editing

Sometimes, we need to filter out all of the additional fluff that gets in the way of our coding. Use "Distraction Free Mode" to clear the screen, except for the code. This option is available, via the View menu. Select "Enter Distraction Free Mode," or use the Mac keyboard shortcut, Control + Shift + Command + F.

14 - A Birds-Eye View

One of Sublime's stand-out features is its unique sidebar that offers a birds-eye view of the current file. This can be incredibly helpful for large files, as it allows us to scan a file in seconds, without manually having to scroll the page.

15 - Multiple Columns

Prefer to edit multiple files within the same window? Sublime offers a handful of split views, including rows and columns. Browse to View -> Layout to view the available choices, and be sure to memorize the keyboard commands, as you'll be using this feature often!

16 - Live CSS Coloring

The "Live CSS" plugin is simple, but helpful. It will automatically set the background of any color value in your stylesheet equal to what you've specified. Certainly, it's a small convenience, but, nonetheless, it can be useful!

17 - Placeholders

During development, many times, we don't yet have the final content for a web application. In these cases, we typically use placeholder text and images. When considering how frequently we do this, wouldn't it be smart to create a handful of placeholder snippets? Well, the placeholder plugin does this very thing!

Whether you need a temporary image, a few "lorem ipsum" paragraphs, or even a definition list with dummy text, this plugin will be perfect for the job.

18 - Indentation Guides

A surprisingly rare convenience, found in Notepad++, is indentation guides. Sometimes, when browsing massive files, it can be difficult to match indentation without a bit of help.

Sublime's indentation guides provide helpful dotted visuals to fix this.

19 - Easy Configuration

Sublime Text is sometimes criticized because it does not offer a flashy interface for setting configuration options. Ironically, in this author's opinion, the fact that Sublime literally displays an editable JavaScript object is one of its greatest strengths. This makes the process of tweaking Sublime's settings exactly to your needs as simple as humanly possible.

For instance, to disable the "Indent Guidelines," open the "Default" settings file, search for draw_indent_guides (with Command + i), and set its value to false. Easy! Be sure to review all of the available settings.

20 - File-Switching in Milliseconds

If you're still manually referring to the sidebar to find the desired file to switch to, you're doing it wrong. Sublime's instant file switching is incredible, and is faster than you've ever experienced in an editor.

Type Command + p to bring up a list of all the files in the current project. You can now use fuzzy searching to choose the file that you wish to switch to. Need a list of all the JavaScript files? Type .js. You'll find that, as you type your search, Sublime Text will, with lightning speed, switch to the top-most file that matches your search query.

This is the preferred method to navigate to new files. The sidebar is a last resort.

21 - Key Bindings

Sublime gives us the ability to easily set key bindings to trigger any command. While a great deal of bindings are already built in, if you wish, you can modify them to your needs.

Consider the binding for moving a file to a different window, when working with multiple columns. By default, we'd need to press Control + Shift + 2; however, this can be a bit difficult to remember. Let's instead remap this to Option + 2.

While we could edit the default keybindings file, this is a bad practice, due to the fact that any Sublime update will reset your customizations. Instead, it's best to edit the User Key Bindings file.

[
    { "keys": ["alt+1"], "command": "move_to_group", "args": { "group": 0 } },
    { "keys": ["alt+2"], "command": "move_to_group", "args": { "group": 1 } },
    { "keys": ["alt+3"], "command": "move_to_group", "args": { "group": 2 } },
    { "keys": ["alt+4"], "command": "move_to_group", "args": { "group": 3 } }
]

Don't worry; if this looks confusing, search the default keybindings file for the settings that you need to alter, and then copy and paste them into your user keybindings file, and update the "keys" accordingly.

22 - Live Searching

When we need to search a file, we often resort to bringing up a "Search and Replace" panel, which takes up time. Instead, press Command + i to perform a live search on the current file. You'll be amazed by how much quicker this method is.

23 - Code Folding

Naturally, Sublime Text provides support for multi-level code folding. Let's say that you're working on a stylesheet, and want to hide all properties; either choose "Edit -> Cold Folding -> Fold All", or press Command + k + 1.

Nice! To unfold all blocks, press Command + k + j.

The keybindings may take some time to memorize, but it's worth the effort.

24 - Development Version

Don't forget that Sublime Text 2 is actively being developed. I encourage you to use the development version, available at sublimetext.com/dev. Don't worry; even though they're development versions, you'll rarely come across any bugs.

25 - Instant Alignment

The Alignment plugin, by Will Bond, will instantly adjust your code to make for more beautifully laid out code. Mostly commonly, it is used to ensure that the equal sign, =, for variable assignments line up.

Installed via Package Control, the Alignment plugin can be activated by selected an applicable piece of code, and pressing Control + Shift + a.

In effect, the plugin will translate:

var first = 'Joe';
var last = 'Black';
var job_title = 'Death';
var status = 'On holiday';

Into:

var first     = 'Joe';
var last      = 'Black';
var job_title = 'Death';
var status    = 'On holiday';

Simple, but helpful!

Closing Thoughts

Clearly, there are many more secrets and tricks in Sublime Text 2 but this list will get you started! If you'd like to learn more about this fantastic editor, be sure to refer to our upcoming course: "Perfect Workflow in Sublime Text 2."