

Brackets – open-source code editor built with the web for the web - flipstewart
http://brackets.io

======
eggsby
Why would I want to use or contribute to this over something like
<http://codemirror.net/> or the various tools powered by codemirror? (light
table, jsbin, etc)

edit: I see that this is also powered by codemirror, the editor itself, so
what does this offer on top of it?

I can't even find a feature list on this page, and after signing up for the
adobe ~cloud~ I haven't been able to make my way to a working demo of the
application...

~~~
grey-area
The docs are a bit confusing - given the target market they should change
'Check it out' to demo or something, but there are binaries you can download
for Mac and Windows, you don't have to sign up for the Adobe Cloud thing at
all. It's a desktop app, and here's what it looks like:

<https://github.com/adobe/brackets/wiki/Brackets-Screenshots>

A quick off-the-cuff comparison, not being familiar with all of these tools,
I'm sure others will jump in and correct/clarify:

CodeMirror - this is for embedding in pages only, and has no way of editing
files etc, so you'd need to use a wrapper like:

CodeMirrorUI - a wrapper using the API to add some editor-like functionality,
but it's still not a standalone editor app.

Light Table requires Java, and is focussed on Clojure (and JS?) right now, so
although the ideas and interface have been borrowed from in Brackets, it's not
really in the same space right now, and is likely to diverge as time passes.

Jsbin - this is probably the closest in feel to the Adobe offering, though it
runs in a browser, not as a local app. That rules it out for me.

So this is more like TextMate based on CodeMirror - it could be used as a
replacement for another editor like Dreamweaver, Coda, Textmate etc, and while
the focus is on html/css/js, it'd be nice to see them expand that eventually
to other domains. I suspect though they'll keep it tightly focussed on html,
css and js.

It's worth downloading the demos here to try it out:

<https://github.com/adobe/brackets/downloads>

This looks like a really interesting new direction from Adobe, and an attempt
to get back a bit of mindshare in a market where currently they are seen as a
stodgy old dinosaur with products like Adobe® Dreamweaver®™. I'll certainly be
keeping an eye on it as TextMate user currently, however I'd need support for
other languages. Having had a little play with the download, I can say it's
really not ready for primetime (only live edit of css is working right now,
not even html edits), but what you can see looks really impressive, the UI is
clean and works well, and if they have the language coverage of CodeMirror
that would be really interesting (if not it'll still be useful, but could not
replace TextMate for me for example). This might be worth a look in a few
months when they have it all working properly.

~~~
drivebyacct2
your analysis of CodeMirror is very inaccurate <http://codemirror.net/>

~~~
grey-area
Would be interested in knowing more detail on this thanks - I had a quick look
at their website previously, and their quick summary (which seems to sum the
rest up well) is:

 _CodeMirror is a JavaScript component that provides a code editor in the
browser._

NB this does not mean editing _files_ in a filesystem but editing code in a
browser (which could then be saved to a db or files by a web app/desktop app).
Obviously it's possible to write such an app (like brackets), based on
codemirror.

I'd be really interested in a codemirror which did manipulate source code
files directly (and was not limited to html,css and js), but got the
impression from their website that they offer lots of in-browser editing, but
not an app which lets you interact with a local file system and edit files.

Did I get that wrong? If so would love to know more (or any other corrections
you'd care to add).

~~~
drivebyacct2
Oh, I guess we differ on definition of "edit". You can edit the files and it's
still really useful (<http://play.golang.org> is an example).

I mean, you're right in that it can't write to the FS, but that's a HTML
limitation... you juts need a shim in webkit container to do this, or you
could use filepicker.io or similar techniques.

~~~
grey-area
Funny you mention play.golang.org as that's _exactly_ what I'd love to be
running locally to edit go and ruby, and run it as I edit. Guess I'm old
fashioned but prefer to edit locally.

As you say, in theory at least not too hard to wrap in WebKit, but I have a
feeling it might be more work than it first appears, and am too busy right now
to attempt it and was hoping someone else had. Maybe one day. Thanks for
elaborating.

~~~
drivebyacct2
One of my next projects is to use diff-path-merge to build cloud9 for Go. I
want to be able to have collaborative editting combined with Go's fast
compiles to have a multi-user cooperative coding environment.

But it will still use a "shim" of sorts. It will basically sync via d-p-m and
websockets to a server that will do the saving/building/running and then
return the output.

------
just2n
So I'm used to debugging in Chrome, so I instinctively open the browser's dev
tools to find that this breaks the Live Preview. It feels somewhat like
there's a quantum property here: things work like magic (the browser is
apparently opening a static CSS file from file://), but as soon as you try to
observe it, it starts behaving as expected (no live updates for you!). That
seems a little bit odd.

~~~
ytpete
Brackets core contributor here... The reason for this is the webkit remote
debugging API is used both by Brackets' "live preview" as well as by the
developer tools panel. The remote debugging API only allows one connection at
a time, so one kicks the other off the connection.

Here's the Chromium bug:
<http://code.google.com/p/chromium/issues/detail?id=129539>

And a related discussion thread:
[https://groups.google.com/forum/?fromgroups=#!topic/google-c...](https://groups.google.com/forum/?fromgroups=#!topic/google-
chrome-developer-tools/yILc8RYUz48)

------
antihero
I can't really see enough information about it on the site - what makes it so
great? Perhaps making a screencast showing it doing some great things will
help adoption.

Other considerations - pretty much any front-end person that isn't a masochist
is going to be using a preprocessor like SASS or LESS - how will the editor
support this? (also consider CoffeeScript, for instance).

~~~
ytpete
Here's a somewhat older intro video:
[http://www.youtube.com/watch?v=rvo3Mv1Z4qU&feature=playe...](http://www.youtube.com/watch?v=rvo3Mv1Z4qU&feature=player_embedded)

------
woah
Man, I really wish I could use this, I code JS, HTML, and CSS all day, and
would love to hack on my own editor, but don't have the time to learn lisp or
c.

No linux version :(

~~~
flipstewart
You could always make the Linux version!

~~~
zanny
It probably runs under Wine, looking at the binaries it seems to be built
against dx9 and gl ES, so it hopefully would default to gl ES if any problems
come up.

~~~
aliem
the container application is based off CEF3 (
<http://code.google.com/p/chromiumembedded/> ) , here is the repository
<https://github.com/adobe/brackets-shell>

------
dqminh
anyone knows how does this perform compared to <http://ace.ajax.org> ?

~~~
chr1
this uses codeMirror as a core editing component ace is faster and more code
friendly than codeMirror. (multiSelect, indentGuides, folding) but codemirror
is smaller and supports variable width and bidirectional fonts

currently there is no comparable desktop project using ace but maybe there
will be something soon <http://www.indiegogo.com/happyedit>

------
tangue
Tried it and liked it. The UI is pretty clear even if it's not ready for
production.

I think this is what a lot of us missed. As webdesign is moving away from
wysiwyg we need a new breed of text editors (I _love_ Emacs but it's not very
efficient for CSS/HTML/JS development).

------
vanni
Previous discussions:

<http://news.ycombinator.com/item?id=3917637>

<http://news.ycombinator.com/item?id=4159552>

------
norswap
I see no mention of how the editor will be customizable (keybinds, defining
new commands) which is what this kind of online editor often lacks and is one
of the cornerstone of the success of offline editors (emacs, vi, even
SublimeText and TextMate).

~~~
ytpete
Brackets is fully extensible -- here's a getting started guide for writing
extensions: [https://github.com/adobe/brackets/wiki/How-to-write-
extensio...](https://github.com/adobe/brackets/wiki/How-to-write-extensions)

The powerful thing about Brackets is that extensions (and the rest of Brackets
in fact) are written in JavaScript, so basically every Brackets user has all
the skills necessary to write an extension and customize their development
environment.

We don't have an easy way to customize key bindings yet, but it's on our
backlog: [https://trello.com/card/keyboard-shortcuts-stored-in-json-
fo...](https://trello.com/card/keyboard-shortcuts-stored-in-json-for-
customization-5/4f90a6d98f77505d7940ce88/352)
[https://trello.com/card/keyboard-shortcut-customization-
inte...](https://trello.com/card/keyboard-shortcut-customization-
interface-8/4f90a6d98f77505d7940ce88/362)

------
dchichkov
Whoever you are, if you develop an editor, please approach it as a hard real
time system.

------
mesh
fyi, you can see a video of an overview of Brackets here:

[http://www.youtube.com/watch?v=2Tk7AUaExBQ&feature=plcp](http://www.youtube.com/watch?v=2Tk7AUaExBQ&feature=plcp)

------
desireco42
interesting, that is all I can say. I see it is made with special focus on
javascript, that is definitely welcome. Code looks really awesome.

------
snprbob86
Demo?

~~~
just2n
TFA: <https://github.com/adobe/brackets/downloads>

Has builds for OSX and Windows.

~~~
snprbob86
Skimmed the site and saw:

"FOR THE WEB, BY THE WEB"

"Brackets is built using HTML, CSS and JavaScript. If you can code in
Brackets, you can code on Brackets."

"WORKS WITH YOUR BROWSER"

Spent 5 seconds skimming the page up and down for a "Try It" or "Get Started"
link, but only found "Check It Out". After 3 seconds of reading, I re-
interpreted "Check-Out" as in the source code sense. Re-scanned the page, no
other obvious demo headings, so I closed the tab.

Despite the page's high level of visual polish, it completely failed at
explaining to me what the app was and how I should go about getting it.

~~~
dorian-graph
For me, this is how it happened—I looked at the screenshot and liked how it
looked then read the About Brackets blurb to get a good idea. Finally, I found
a Mac binary easy enough from the Check It Out part.

Obviously, both these experiences are quite different and both would lead
someone to make a certain conclusion about the website. Which is 'correct'
then?

Personally, I just hope some of the neat features (Inline CSS editing) appears
in Sublime Text 2.

