Adobe releases Brackets 1.0 for elegant front-end coding

Ben Moss.
November 05, 2014
Adobe releases Brackets 1.0 for elegant front-end coding.
thumbnail

If you’re a front-end coder, you may well have been stunned yesterday, by Adobe’s latest release: Brackets. Stunned that is, because you’ve probably been using it for a year or more. The version you had been using was the beta release — a beta release that proved so popular many developers already use Brackets as their primary code editor. One of the most popular beta test versions of a piece of software in the history of the Web, Brackets is a free, open source application substantially supported by Adobe. The latest release is the first full version and is packed with some great new features. Built in HTML, CSS, and JavaScript, Brackets is the only text editor that I’m aware of that actively focuses on those same languages. There are countless editors on the market, but with support for PHP, C++, Python, and dozens of other technologies they can’t target the same workflow as Brackets. Brackets focusses on the front-end only, freeing it to deliver amazing features like inline editing; where CSS code associated with an HTML element can be edited just by hovering over it. If for some reason you haven’t already tried Brackets, download it and try out the Live Preview feature — the first time I used it my jaw hit the desk. If you’re a fan of Less, or Sass, you’ll also love the preprocessor support. The value of Brackets is that it’s a joy to use. And because it’s a joy to use it has a committed community that not only contributes to its source code, but releases some incredible extensions that are free to install. The one downside is that the option to open and edit a file live on a server isn’t available — some extensions offer ftp support, but not live editing — so if that’s part of your workflow, you’ll have to hang on to your current editor (something you’ll be doing in any case for the likes of .htaccess files). Unfortunately, all may not be rosy in the Brackets-lover’s world, because as well as Brackets 1.0, Adobe have released Extract for Brackets. Extract is a free extension that allows you to pull design data (colors, fonts, and so on) out of your PSD and straight into Brackets. Except of course that you don’t have a PSD, because you’ve embraced the Brackets workflow and you’re designing in the browser. Adobe’s blinkered persistence in tying everything into Photoshop does as much damage to their flagship product as it does to the rest of the product range. Shackling an elegant coding solution to a bloated and increasingly dated bitmap editor, seemingly serves little purpose. However, Extract is currently optional; I sincerely hope it stays that way. If you code the front-end of websites, or would like to start, Brackets is one of the best options available. The fact that it’s free, and runs on Mac, Windows, and Linux should be enough to make builders of commercial code editors very worried indeed.

Ben Moss

Ben Moss is Senior Editor at WebdesignerDepot. He’s designed and coded work for award-winning startups, and global names including IBM, UBS, and the FBI. One of these days he’ll run a sub-4hr marathon. Say hi on Twitter.

Read Next

Are Simple Websites Better For Business?

As web design technologies raise the bar on what it is possible to achieve on a realistic budget, there’s a rising deba…

Apple Opts for AR over VR at WWDC

An Apple VR headset has been one of the most widely-rumored devices of the last few years, and it was finally settled a…

Exciting New Tools for Designers, June 2023

We’re halfway through 2023 already, and the number of incredible apps, tools, and resources for designers is mounting.

3 Essential Design Trends, June 2023

This month we are focusing on three trends within a bigger website design trend – different navigation menu styles and …

15 Best New Fonts, May 2023

The choices you make when selecting a typeface have more impact on your design than almost any other decision, so it’s …

10+ Best Tools & Resources for Web Designers and Agencies (2023 updated)

Having the ability to envision a tastefully designed website (i.e., the role creativity plays) is important. But being …

20 Best New Websites, May 2023

This month, there are tons of great new agency websites to get excited about. 3D animated prisms are a popular theme, a…

How to Find the Right White Label Website Builder for Your Agency

Web design agencies face a lot of obstacles in closing the deal with new clients. One of the most common ones is the ar…

Exciting New Tools For Designers, May 2023

There are hundreds of new tools for designers and developers released each month. We sift through them all to bring you…

3 Essential Design Trends, May 2023

All three of the website design trends here mimic something bigger going on in the tech space, from a desire to have mo…

10 Best AI Tools for Web Designers (2023)

It’s time to stop worrying if AI is going to take your job and instead start using AI to expand the services you can of…

10 Best Marketing Agency Websites (Examples, Inspo, and Templates!)

Marketers are skilled in developing strategies, producing visual assets, writing text with high impact, and optimizing …