24 Necessary Brackets Extensions
Brackets is a source code editor with a primary focus on web development. Created by Adobe Systems, it is free and open-source software licensed under the MIT License and is currently maintained on GitHub by Adobe and other open-sourced developers. Brackets have been rising in popularity as a code editor meant for front-end development and web design. Here is a list with useful brackets extensions.
Beautify Brackets extension makes your code look good. Not only does it make your files more readable, but it also gives you a handy shortcut key to beautify those files — CMD-Shift-L (Mac) and Ctrl-Shift-L (Win).
Autoprefixer is a postprocessor for dealing with vendor prefixes in the best possible way. The Autoprefixer parses CSS files and adds vendor prefixes to CSS rules. All you have to do is to add it to your asset building tool. Also cleans outdated prefixes as well.
Emmet helps improve your HTML and CSS workflow by letting you type in CSS-like expressions that can be dynamically parsed and produce an output according to what you actually typed in the abbreviation.
ToDo is a Brackets extension that displays all To-Do comments in the current document or project. By default, it supports five tags — TODO, NOTE, FIXME, CHANGES, and FUTURE. To keep track of your team’s progress, you may mark tasks as done.
Bracket Gits is an extension for Brackets editor that provides Git integration for Brackets. It is tested and works on any platform supported by Brackets (Windows, Mac OS X, and GNU/Linux). Bracket Git is easily the best among similar Brackets extensions as it lets you easily commit changes from Brackets itself, as well as push and pull changes with a single click.
Swatcher generates code hints and color palettes by importing via LESS/SASS files, images or Adobe Swatch files. It supports all color-related functions, such as rgba(). Swatcher also comes with a built-in color picker of its own.
Lorem Pixel is a Brackets extension that can be used to generate placeholder images. It is simple and free of cost. It lets you insert beautiful placeholder images of any size. Lorem Pixel also gives you a grayscale option to use only black and white placeholder images.
eqFTP is an FTP/SFTP client for Brackets code editor. It delivers an intuitive interface to work with your remote servers, synchronization, and remote file structure exploring, and password encryption. eqFTP can be used to transfer and sync your project’s files to and from your web host and server.
Color Picker appears to be handy if you are working with CSS files. It can help you pick colors within minutes right within Brackets.
CSScomb is a utility to sort CSS properties within each selector declaration in a predefined order. It helps in maintaining uniformity and makes code independent of coding style. It helps you understand the code and prevents accidental errors, and also sorts properties with multiline values. In other words, CSScomb Brackets extension can help you reduce bugs in your code and maintain uniformity.
HTML Skeleton is a collection of a set of tags required by every HTML webpage you build. The tags that make up the skeleton tell browsers what kind of file it is reading and without the skeleton. This is a must-have extension if you regularly use HTML to build pages in Brackets.
HTML Wrapper is a Brackets extension that formats nav and select tags with a single command. You can use it by selecting a list of items encapsulated by the desired tag and then run the command.
The minimap is a Brackets extension that comes with syntax highlighting, autohide functionality, adjustable fading transparency, the quick preview function, zooming, and smooth scrolling. It displays a sublime style map of your code within the editor and works well with third party themes.
Legibility Brackets extension increases the legibility aspects of your code, such as font sizes, line heights, heights of the elements like code hints, drop down menus, status bar, vertical toolbar, modal bar, bottom panel, and extension modal.
Live Reload is a Brackets extension that monitors changes in the file system. It keeps track of the changelog of your project files and is refreshed automatically.
CSSLint is a Brackets extension that can enable CSS linting support. It makes use of Bracket’s built-in linting system. It shows errors with a yellow warning icon, and if there are no errors, a green icon is displayed instead.
Brackets Extension Rating can be used to display other extensions’ statistics based on downloads and GitHub stats. It shows online and maximum users counters for selected extensions, and displays star and forks counter from the GitHub repository.
ClipBox is an extension for keeping track of your clipboard history. It captures Ctrl+C keystrokes and stores selected text in its own internal array. ClipBox can store a maximum of ten clipboard items.
Brackets Bookmarks extension provides functionality to bookmark lines in Brackets. Bookmarks are serialized and remembered globally. This extension lets you add bookmarks to file and close the file. When you reopen the file, Brackets will restore the bookmarks.
Interactive Linter integrates with linters such as JSHint, JSLint, ESlint, JSCS, CoffeeLint, and more. As you work on your code, this extension gives instant feedback right in the document. You can access the details of the lint report therein and then work accordingly.