Getting Started with Adobe BracketsSubmitted by smartyP on Fri, 08/03/2012 - 22:00
Adobe Brackets is an open source editor for open standard web languages (html/css/js/less/etc). It is totally free, and is a pretty exciting editor to try out. While Adobe says the editor isn't quite ready yet for prime-time, it can be a great tool if you are looking for a free open standards editor for web development. Written itself in html/css/js/less, Adobe Brackets aims to be incredibly extensible and is looking to build a community of contributors through GitHub.
(click 'read more' below..)
To get Brackets setup, go to the Adobe Brackets Github Downloads page and download the latest sprint. Once you unzip the download, run the appropriate Windows or Mac client out of the /bin subfolder. You will notice there are two File menus - the interior menu is the one you'll want to use to open up individual files, or a specific folder - the exterior File menu is part of the application wrapper around Bracket's html/css/js core.
Clicking the Live Preview button while editing an HTML page will attach Brackets to your Google Chrome browser and allow you to edit any relative CSS styles and see the changes occurring real-time. This is especially snazzy when doing quick concepts or initially styling some html as you can watch the page come together as you hack out your CSS styles.
Editing a CSS style in-line with the HTML with Adobe Brackets (ctrl-e)
Brackets also supports editing CSS styles inline in the HTML editor (see image above). You can pull up the in-line editor by having your cursor on any class or id attribute and pressing Ctrl-E. This inline editor works great with the live preview as well, and can make quick updates to HTML simple as you don't have to track down the relative CSS styles manually.
I've been using brackets now for the last 3-4 sprints they've released. I think it is a great editor - especially since it is free (and can run off of a jump drive). I will be more likely to use it as my daily driver once predictive text and text hinting gets added in, but in the mean time I'm still mostly sticking to Sublime Text for now. Kudos to Adobe for putting this project together. There is a ton of opportunity in this open source project, and I can't wait to see where it goes.