Is there a good in-browser code editor?

Viewed 31252

We've all seen in-browser rich text editors, which allow you to edit colored/styled text in a WYSIWYG manner. But what about code editors, which automatically highlight code based on language rules as you type? Think Eclipse in a textarea (but without the refactoring support).

Do such things exist? I imagine scaling would be a problem - larger files would be difficult to edit efficiently.

11 Answers

CodeMirror comes with support for 60+ languages, and addons that implement more advanced editing functionality (autocompletion, code folding, configurable key bindings, search & replace, linter integration etc.). A rich programming API and a CSS theming system are available for customizing CodeMirror, and extending it with new functionality.

It has been developed since early 2007, has a Wikipedia page, and is being used in a wide number of popular open source projects (Joomla, Firebug etc.).

The editArea javascript library does a pretty good job. It's used by the OpenCMS content management system as it's in-place JSP and JavaScript editor. The colorization gets a bit confused when the file is > 2000 lines or so.

The feature list from their page is:

  • Easy to integrate, only one script include and one function call
  • Tab support (allow to write well formated source code)
  • Search and replace (with regexp)
  • Customizable real-time syntax highlighting (currently: PHP, CSS, Javascript, Python, HTML, XML, VB, C, CPP, SQL, Pascal, Basic, Brainf*ck)
  • Auto-indenting new lines
  • Line numbering
  • Multilanguage support (currently: Croatian, Danish, English, French, German, Italian, Japanese, Polish, Portuguese)
  • Full screen mode
  • Can work in the same environment than "protype" and "mootools"'s like libraries.

Mozilla's Bespin looked very interesting, but the project was discontinued.

Cloud9 looks interesting if you're a JavaScript developer.

Amy Editor is another browser-based editor I've come across today - it looks like it is trying to emulate TextMate in the browser - including Bundles and Snippets - although the project looks like it's likely dead... Homepage/Demo and source on GitHub

Javascript VI, has some bugs but is an interesting idea. VI FTW!

This is a sideways suggestion -- but I use the Firefox plugin "It's All Text!" to send my text-areas to for editing -- all good markups,searching, etc.

Of course, this is user-dependent, and can't be easily rolled-out to visitors, if that is your intent.

However, I tend to get irritated by the limitations of in-browser editors, anyway. (The way SO captures my C-k during edits STILL catches me off-guard... [which means I don't edit everything in Emacs...])

Related