A Code Editor Built Using Only HTML, CSS and JavaScript

An open source project led by Adobe, Brackets is still in its early stages of development — but that hasn’t stopped me from using it as my primary front-end web development code editor.

Its code auto-complete is smart, and feels seamless and natural as you’re typing:

Brackets uses progressive disclosure in the UI outstandingly well.

For example, as you type a hexadecimal color value, Brackets will progressively disclose an inline preview of the color, and also a color picker in case you want to tweak the color:

Another example is when you hover over the src attribute value of an <img> element, it shows you a thumbnail preview of that image:

Brackets supports the idea of designing in the browser. When you preview your work, it will open an instance of Google Chrome. As you’re coding, it will seamlessly update the preview in Chrome and highlight any changed elements with a blue border:

Brackets is perfect for dual monitors. Have Brackets on one monitor, and the live preview on the other.

The main thing missing in Brackets is a built-in FTP — a deal breaker for anyone looking for a full-on front-end IDE.

But, Brackets does support extensions — a powerful feature that will become a game-changer once its community broadens a bit more, as we’ve already seen in mainstream projects like jQuery and WordPress whose successes are deeply rooted in their extensibility through community-developed plugins.

There’s an extension called brackets-ftp if you really needed a built-in FTP instead of a standalone app like FileZilla:

What I appreciate most about Brackets is how well-thought-out its interface is. As you use it, I promise you that you’ll discover features and UI design decisions that will make you say "Oh, that’s awesome."

And it’s cross-platform: You can use it on Windows, Linux, and Mac OS.

It’s quite tough to create a minimalist code editor that’s effective, productive, and efficient. The people behind Brackets were able to do it.

  • Bob

    Been using it for a while, great program. Another great feature is in HTML view clicking inside a tag and then hitting CTRL+E to edit that tag in the stylesheet in a nice pop-up, big time saver.

  • hpoom

    FTP is missing because nobody uses FTP any more. Brackets has good tools for git which is how everybody should be storing their code. Regards deploying code I would like to see Brackets get better hooks into Grunt. We could all then use Grunt to push to S3 or other hosting options.

  • Looks fairly impressive. I’m currently using Sublime Text but might give this a trial run to see how it compares. I like the dual monitor support too as I run a dual monitor setup.