To the outside world, developers can have an unhealthy fixation with their code editor. It’s not surprising — most of us spend longer with our IDE than our families. Sean’s recently-posted list of free editors provoked a plethora of debate about what is and what’s not the best coding tool.
There are dozens of code editors to choose from and many are freeware or open source. Ultimately, the choice is yours, whether it’s Windows Notepad, VIM or VisualStudio. However, there are a number of key IDE features that I’d recommend to all web developers.
Essential Features
An editor won’t remain on my PC if it doesn’t provide the following:
Speed and stability
The editor must start quickly and remain responsive. Sorry Eclipse and Aptana.
Multiple files / MDI interface
The days of opening a single source file are long gone. Tabs are my preferred choice of interface and they absolutely must support middle-click closing!
Multiple language support
Even the most basic web projects require HTML and CSS. A simple application is likely to add JavaScript, SQL, XML, and a server-side development language such as PHP, C#, VB, Java, Perl, Ruby or Python. Your editor should be able to effortlessly handle every type of code you choose.
Line wrapping and numbering
It may be bad practice, but long lines of code are sometimes necessary. The editor should let you view code without horizontal scrolling, so a line wrapping option is essential. When the inevitable error occurs at line 4321, you need to be able to find that bug quickly — so forget any editor that does not display line numbers.
Configurable color-coding
Missing quotes or tags can cause havoc, but color-coding can dramatically reduce your error rate. Bonus points are awarded for any editor offering fully-customizable color schemes.
Auto-complete
Microsoft VisualStudio sets the gold standard with IntelliSense. Few editors reach that level, but if I’m adding a <p> tag, you can guarantee I want a closing </p>. Please don’t make me type it!
Session store and restore
When the editor is restarted, it should restore the files you were working on, open them in the correct order and preferably at the last line you were editing.
File explorer
The option to open other files in the current project can save time.
Find and replace across files
How many times have you renamed a class or function? The editor should provide facilities to change all references quickly and easily.
Desirable Features
The following options are great if they’re available:
Debugging tools
Debugging facilities range from absolutely essential (.NET or Java), to useful (PHP or Perl), to unnecessary (JavaScript — unless it’s better than Firebug!) Make sure your editor provides the debugging tools you need.
Bookmarking
Jumping between functions in the same file is easier if you can bookmark individual lines.
Multiple views
Similarly, it can be useful to ‘split’ a file into multiple windows so different segments can be edited at the same time.
Code-folding
The facility to collapse or expand segments allows you to concentrate on the important code.
Code explorer
Again, VisualStudio sets the standard with class inspection windows showing details of all properties and methods. However, a simple list of method/function names in alphabetical or source order can be just as useful. Bonus points for any editor which handles the multiple types of function declaration in JavaScript!
Good font support
In general, I prefer to code using a proportional font. I may be in the minority, but please don’t force me to use monospace! SciTE offers the best solution; you can switch between monospaced and proportional fonts using Ctrl+F11.
Shortcuts, plugins, and macros
If you use particular keyboard combinations or functionality, configurable shortcuts, macros and plugins can help you migrate to another editor.
And the Bad Features…
Sometimes, editors offer dubious functionality that you really do not need.
WYSIWYG design view
Whilst WYSIWYG can be useful for novice developers, you will soon discover that hand-coding HTML and CSS is quicker than any design package. It can also be essential if your application requires DOM manipulation. If a WYSIWYG view is provided, make sure it doesn’t refactor your carefully-crafted code when you accidentally hit the ‘design’ button.
Obtrusive project management
Sometimes, you just need to open a file and make a minor change — please don’t force us to create a new project!
Dumb HTML-generation tools
I do not need a toolbar icon that uses valuable screen estate and inserts a <p> tag. And I certainly don’t need icons that insist on adding deprecated <b> tags!
What are the essential features you look for in a code editor? Are there any “features” that particularly annoy you?
Craig BucklerCraig is a freelance UK web consultant who built his first page for IE2.0 in 1995. Since that time he's been advocating standards, accessibility, and best-practice HTML5 techniques. He's created enterprise specifications, websites and online applications for companies and organisations including the UK Parliament, the European Parliament, the Department of Energy & Climate Change, Microsoft, and more. He's written more than 1,000 articles for SitePoint and you can find him @craigbuckler.
