The best brackets extensions to improve your workflow
Every developer has their preferred code editor and finding the one that works best for you and your requirements is paramount to a streamlined workflow. After experimenting with all the big hitters (Atom, Sublime, Coda) I decided my preferred one is Brackets.
Brackets is an open source text editor that is built with web developers in mind. With a big community, releases are frequent and there are a lot of active developers to solve any issues on the Git page. As well as being constantly developed, there are also a plethora of extensions to choose from which enable you to tailor the software to your needs. These extensions make Brackets! Below are our favourites:
Variables allow us to set global attributes that are used throughout our stylesheets which ensures the consistency of our projects. Sometimes it is hard to remember if an attribute has been used before which is where SASSHints steps in. It gives a list of all variables and their values outside of the stylesheet that they are declared in.
Coming from working with Notepad++ this was a must for my code editor. When you select a word it will highlight all the other occurrences of it in the file. This is particularly useful to spot any spelling mistakes that might be breaking your code.
This extension gives all your files a bright, high contrast icon. This makes finding the files you need a lot easier. It also makes the folder structure clear with just a glance.
Good indenting and a well maintained code structure dramatically improve the ease of debugging. This extension makes keeping your code tidy easier by adding faint indent guides so it becomes immediately apparent if you’re missing a closing bracket.
When developing a site on a dev server you will need to update multiple files on a regular basis. Using a standard FTP client such as Transmit or FileZilla to drag and drop your files to the server every time you wish to see the results of your changes is an avoidable laborious task. With eqFTP you can manage all your project FTP details from inside Brackets and set the files to auto sync once a file has been saved/updated. If there’s one extension to take from this blog post, it’s this one. You’ll save yourself hours of time.
As a developer, your text editor is your main tool which means you will more than likely be looking at it for large portions of the day. Besides taking regular breaks from your screen, it’s also important to find a theme that greatly eases the stress on your eyes. Everybody is different so it’s important to find a theme that works for you.
As a general rule it’s a good idea to reduce the contrast between the background and the text so use greys rather than black and white.
New Extensions are always being developed by the open source community so it’s a good idea to keep an eye on new releases to catch any that could help streamline your process even more!