5 Essential Adobe Brackets Plugins - thinklab - thinklab

5 Essential Adobe Brackets Plugins

Having spent several years writing code in Sublime Text and then Atom Editor (and Coda before that), I recently switched my text editor – again… enter Adobe Brackets. Brackets is a community-guided, open source editor that was founded by Adobe. It’s free and, due to it’s open source nature, is very extensible. However, this isn’t going to be a review of Brackets (there are plenty of those on YouTube) and I won’t be going into the reasons why I started using Brackets. Instead, here’s my roundup of what I consider to be 5 essential plugins for the editor.

1. Editor Line Style

Currently, Brackets doesn’t ship with a setting for adjusting line height, which is something I always like to do when using a new text editor. After some searching around, I found the Editor Line Style plugin, which lets you do just that. I imagine a native line height setting will be released with future versions of Brackets, but until then, this plugin does the job fine.

2. Indent Guides for Brackets

One thing that I just can’t code without are indent guides. I like to be able to see where my HTML tags open and close, at a glance. Well, Indent Guides for Brackets covers that one.

3. Emmet

Many of you will probably already be familiar with Emmet, as versions of it exist for most text editors. For those of you that haven’t heard of Emmet, it’s a really handy plugin designed to greatly improve your HTML and CSS workflow. For more information on Emmet, check out docs.emmet.io.

4. Brackets Git

As web developers, we are constantly committing our code (or at least we should be) to Git/Bitbucket repos. I would normally use the command line for tracking and committing files, however, I like that this plugin is integrated into the coding environment. As such, it allows you to see what branch you’re currently working on, and even adds coloured highlights to new/modified chunks of code that are yet to be committed. I find it helps me to make commits more regularly too (we’ve all at least once got to the end of a full day of coding and suddenly realised not a single commit has been made :p).

5. Interactive Linter

Who doesn’t love linting JavaScript? The Interactive Linter plugin adds a little yellow lightbulb in the relevant line gutters and displays the lint report on the line underneath when opened. Non-intrusive and very useful indeed.

That concludes the roundup. Feel free to add your favourite plugins in the comments below.

Happy coding!

Brought to you by Christian Redecen-Davies

Designer. Traveller. Photographer. Purveyor of fine pixels since 1999.

See all posts by Christian Redecen-Davies