8 awesome extensions for Brackets

Brackets has not yet replaced Sublime Text as my primary text editor, but it’s a definite possibility. The quick edit functions are great, it’s always nice to have a color picker handy, it’s light, it’s fast, and it looks kinda purdy.

I’ve used it for light editing, as well as a couple of code experiments, so I have a pretty good idea of what it’s like to use it regularly.

I have a few issues, of course; getting the live preview to work with a local copy of WordPress seems downright impossible at the moment. Also, while you can edit any linked CSS file directly from any HTML document, that doesn’t work so well when you’re using LESS or SASS. Oh, and I still want to be able to edit multiple lines of text at once, like I can in Sublime Text.

Then again, the program is still in relatively early stages of its development, so there’s a lot of good stuff that’s coming, it just isn’t here yet.

These issues aside, working in this application gives me an almost unconscious sense of pleasure and well-being, and that counts for a lot with me. Sure, that’s practically the definition of subjective criteria, but subjective criteria do matter when you’re looking for the software that’s right for you.

Then, there’s the extensions. The library of extensions is growing rapidly, as interest in Brackets spreads throughout the community. Most of the extensions don’t alter the program in any huge way; for the moment, they seem to take care of smaller, more “niggling” issues that its users encounter. But that’s the beauty of an IDE built in HTML and Javascript: almost anyone can go ahead and fix any problems that they find.

There are some great extensions, and more are being added all the time. Here are my favorites, in alphabetical order:

Autosave files on window blur

In this plugin‘s case, “on window blur” means that whenever you select a window that isn’t Brackets, your files will be saved automatically.

This is perfect for me, because I’m constantly switching between programs, such as my browser and image editor, while I work.

The files get saved, LESS files are compiled, it saves me a little time, and I don’t wear out my “Ctrl” and “S” keys.

Brackets Code Folding

This extension introduces basic code folding to Brackets, if you go in for that sort of thing. Does exactly what you expect, no more, and no less.

Document Outliner

If you’re working in an HTML5 file, this one’s interesting. It creates an “Outline” of your document based on things like nav, header, section, and footer tags. You can access this outline via a panel for quick and easy document navigation.

Emmet

The Brackets implementation of Emmet, formerly known as Zen Coding. Never leave home without this one. Also, why did they ever change that name?

HTML Block Selector

This is a quick and easy way to select an entire HTML block at once. Just “CTRL + Click” on the tag in question, and it will be selected along with all of its contents. Nifty.

Reopener

Need to quickly re-open a file you just closed? Reopener has you covered. Just go to “File > Reopen Closed Tab”, or hit “CTRL + ALT + W”.

Right Click Extended

I can’t believe I have to say this, but…

Dear Brackets Devs,

For the love of all that is holy and good in the world, put things like “Copy”, “Cut”, and “Paste” into the right-click context menu on your own. You really shouldn’t have to wait for someone to make an extension with that functionality. I mean, it should have been the first thing you did after the “Save File” function.

I do love you guys and all of your hard work, so it pains me to say it like this, but come on! There are times when I use my mouse to select text and move it around, or duplicate it. In fact, this is an actual real-life scenario that many, many people encounter every day.

Sincerely, and with much love,

Common Sense

In summary: So yeah, that’s what this extension does… it adds copy, cut, and paste functionality to the right-click menu.

Sidebar Plus

This extension hides the sidebar with a simple keyboard shortcut for those times when you just want to focus all of your attention on one file. Note: If you have the Brackets Tabs extension installed, it hides those too.

Ezequiel Bruni is a web/UX designer, blogger, and aspiring photographer living in Mexico. When he's not up to his finely-chiselled ears in wire-frames and front-end code, or ranting about the same, he indulges in beer, pizza, fantasy novels, and stand-up comedy. More articles by Ezequiel Bruni
Home CSS Deals HTML HTML5 Java JavaScript jQuery Miscellaneous Mobile MySQL News PHP Resources Security Snippet Tools Tutorial Web Development Web Services WordPress