Based on that paradigm, I\u2019ve picked five code editors to consider, which I have gained differing levels of experience with over the last 20-something years of slinging code. They\u2019re not all equal in functionality. However, to those that use and love them, they\u2019re the best choice \u2014 period! That\u2019s why they\u2019re included.<\/p>\n
I\u2019m not going to detail every feature on offer. However, I will give you:<\/p>\n
- \n
- A good overview of each one.<\/li>\n
- A set of some compelling reasons to use them.<\/li>\n
- Some of the areas in which they don\u2019t compare as favorably or where you might need to tread with caution when using them.<\/li>\n<\/ul>\n
The IntelliJ Suite<\/h2>\n
![\"\"](\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/01\/gogland-one.png\")
<\/a>Gogland<\/figcaption><\/figure>\n Starting off the review is the IntelliJ suite of tools<\/a>, including (among others) PhpStorm<\/em>, CLion<\/em>, PyCharm<\/em>, Gogland<\/em>, RubyMine<\/em>, and AppCode<\/em>. There are more IDEs in the suite, but this is a good sampling of what\u2019s on offer.<\/p>\n
The IntelliJ suite, from JetBrains, is available for all major operating systems. Users of their products usually rave about them and are often intensely loyal. I know that, for the most part, as a user of PhpStorm and Gogland, I am. However, enough with the sales pitch, here\u2019s an overview.<\/p>\n
Based on the underlying IntelliJ engine, each of JetBrain\u2019s IDEs targets either a specific language or task, such as the languages mentioned above. And each of them looks quite similar to the others, so much so that if you\u2019ve used one, you will be almost instantly familiar with any of them. Just take the screenshot above, of Gogland (their Go IDE), and the one below, of PhpStorm (their PHP IDE).<\/p>\n
![\"\"](\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/01\/phpstorm.png\")
<\/a>PhpStorm<\/figcaption><\/figure>\n You can see that they provide a professional looking setup, allowing for one or more files in a project to be open simultaneously. These windows are arrangeable in a variety of ways, as best suits each developer. Also, there are the related views or windows into a project.<\/p>\n
These include:<\/p>\n
- \n
- The project view.<\/strong> It shows all the files in a project.<\/li>\n
- The structure view.<\/strong> It displays the structure of the currently active file. In the screenshot below, you can see that it\u2019s listed the three functions received by the
User<\/code> struct in Gogland, in alphabetic order.<\/li>\n- The TODO view.<\/strong> It collates any
\/\/ TODO<\/code> type string anywhere in the code base.<\/li>\n- The Version Control view.<\/strong> It lets you work with the version control system right from the IDE.<\/li>\n
- The Terminal view.<\/strong> It provides a lightweight terminal (or console) for running commands from the command line, for those who prefer that approach (me).<\/li>\n
- The Event Log view.<\/strong> It shows events that have occurred within the IDE.<\/li>\n
- The Database view.<\/strong> It provides access to the database that the app uses, without having to use (or pay for) an external tool.<\/li>\n<\/ul>\n
If you\u2019re not careful, or don\u2019t have a suitably large enough display, it can soon become quite cluttered.<\/p>\n
![\"\"](\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/01\/gogland-two.png\")
<\/a>A very cluttered Gogland setup<\/figcaption><\/figure>\n That said, each IDE, as I mentioned, is targeted to a specific language. Each includes:<\/p>\n
- \n
- A range of preinstalled plugins that make working with that language as efficient as possible, such as Gofmt<\/em>, Golint<\/em>, and Govet<\/em> when working with Go, or Docker<\/em>, Vagrant<\/em>, Composer<\/em>, and PHPUnit<\/em> when working with PHP.<\/li>\n
- A run tool for running the code (including step-through debugging) and its tests, right from within the IDE.<\/li>\n
- Extensive refactoring support, including support for moving<\/em>, extracting<\/em>, deleting<\/em>, renaming<\/em>, pulling members up<\/em>, and pushing members down<\/em>.<\/li>\n
- Painless code navigation, including by class<\/em>, symbol<\/em>, and function name<\/em>, movement to a parent method<\/em>, implementation<\/em>, or somewhere in the call hierarchy.<\/li>\n
- Inspections and intentions. These are static analysis checks, such as for correctness<\/em>, security<\/em>, and style issues<\/em>.<\/li>\n<\/ul>\n
You can buy most of the IDEs<\/a>, individually, for around $199.00 USD, or an all-products-pack for around $649.00 USD. However, these prices are just for one year. Each year there\u2019s a subscription renewal, which tiers downward each year. Depending on your situation, that might be quite expensive. Alternatively, you might have a boss who will pay for it. Either way, it\u2019s something worth bearing in mind.<\/p>\n
Atom<\/h2>\n
![\"\"](\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/01\/atom-editor.png\")
<\/a>The Atom editor<\/figcaption><\/figure>\n The next editor is Atom<\/a>, from GitHub, available for all the major operating systems. It is self-described as:<\/p>\n
A hackable text editor for the 21st century\u2026<\/p><\/blockquote>\n
Quoting them further:<\/p>\n
Atom is a text editor that\u2019s modern, approachable, yet hackable to the core \u2014 a tool you can customize to do anything but also use productively without ever touching a config file.<\/p><\/blockquote>\n
What\u2019s quite interesting about it, and perhaps sets it apart from the others, is that it\u2019s built with the Electron framework<\/a>, a combination of HTML<\/em>, JavaScript<\/em>, CSS<\/em>, and Node.js<\/em>. Given that, it likely will never feel as heavy as the IntelliJ (Java-based) IDEs would.<\/p>\n
By default, it supports the following features:<\/p>\n
- \n
- Cross-platform editing<\/li>\n
- Built-in package manager<\/li>\n
- Smart auto-completion<\/li>\n
- File system browser<\/li>\n
- Multiple panes<\/li>\n
- Find and replace<\/li>\n<\/ul>\n
In addition to these features, you can choose from a diverse and ever-growing range of open-source packages, (split into four categories: community<\/em>, core<\/em>, development<\/em>, and git<\/em>), if the default functionality does not do what you want.<\/p>\n
They include packages for the Asciidoc format<\/em>, beautification<\/em>, linting<\/em>, Pandoc<\/em>, line sorting<\/em>, and VIM emulation<\/em>. More than likely, the default installation is not going to do all that you want. While it provides a lot right from the start, it\u2019s only a start.<\/p>\n
Whereas JetBrains offers a range of IDEs custom-built for specific languages and tasks, Atom is an almost generic code editor. That\u2019s not to downplay it, however. With a little bit of work, you can configure it to be extremely powerful. In the short time that it\u2019s been around, it\u2019s garnered quite a cult following.<\/p>\n
And why not? It\u2019s an incredibly customizable and themeable editor. You can see from the screenshot below that it\u2019s very similar in look and feel to the IntelliJ suite, yet without as many windows<\/em>, tabs<\/em>, toolbars<\/em>, and add-ins<\/em>.<\/p>\n
Visual Studio Code<\/h2>\n
![\"\"](\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/01\/vs-code.png\")
<\/a>Visual Studio Code<\/figcaption><\/figure>\n Then there\u2019s a newer addition to the list, Visual Studio Code<\/a> (or VS Code<\/em>, or even simpler: Code<\/em>), from Microsoft. Also built with the Electron framework, like Atom, Visual Studio Code was released by Microsoft on November 18, 2015, and made its first release on April 14, 2016.<\/p>\n
Available for all the major operating systems, Code supports:<\/p>\n
- \n
- File editing.<\/li>\n
- Debugging (available for JavaScript<\/em>, TypeScript<\/em>, C#<\/em>, F#<\/em>, C\/C++<\/em>, Python<\/em>, and PHP<\/em>).<\/li>\n
- Version Control integration (Git).<\/li>\n
- Syntax-highlighting, available for a large range of languages and file formats, including C\/C#\/C++<\/em>, CSS<\/em>, diffs<\/em>, Dockerfile<\/em>, Go<\/em>, HTML<\/em>, JSON<\/em>, Java<\/em>, JavaScript<\/em>, and PHP<\/em>.<\/li>\n
- Code completion, available for CSS<\/em>, HTML<\/em>, JavaScript<\/em>, JSON<\/em>, Less<\/em>, Sass<\/em>, and TypeScript<\/em>.<\/li>\n
- Code refactoring.<\/li>\n
- Code snippets, available for Groovy<\/em>, Markdown<\/em>, PHP<\/em>, and Swift<\/em>.<\/li>\n<\/ul>\n
Code\u2019s interface seems to walk an impressive line between an augmented text editor and IDE. It can view multiple code windows simultaneously as well asgroup them, a feature available in most IDEs and editors.<\/p>\n
It also has sub-windows, such as for git version control<\/em>, code errors<\/em>, line endings<\/em>, and syntax highlighting<\/em>, among a range of others. Like Atom, it\u2019s primarily configured by having to edit a text configuration file.<\/p>\n
However, Atom had the advantage of having a UI for a default set of options. And, like Atom and the IntelliJ suite, Code can be rapidly augmented by an ever-growing list of extensions. You can find the complete list on the VS Code Extension Marketplace<\/a>.<\/p>\n
There, you will find extensions for areas including basic editing<\/em>, IntelliSense<\/em>, code navigation<\/em>, debugging<\/em>, version control<\/em>, the command line<\/em>, and accessibility<\/em>.<\/p>\n
Sublime Text<\/h2>\n
![\"\"](\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/01\/sublimetext.png\")
<\/a>Sublime Text<\/figcaption><\/figure>\n Now, I want to look at one of the older, more veteran, editors, Sublime Text<\/a>. It\u2019s one beloved of the developers who\u2019ve used it since the early releases. Earlier versions were completely free.<\/p>\n
More recent versions have a limited free usage period before requiring a license for continued usage. However, at the cost of only $80 USD, it is a small price to pay for an editor as capable as Sublime.<\/p>\n
Here\u2019s why. Recently releasing version 3, Sublime Text is self-described as:<\/p>\n
A sophisticated text editor for code, markup, and prose.<\/p><\/blockquote>\n
Available for the major operating systems, it is quite similar in layout to both Atom and VS Code. I can\u2019t say for sure, but my feeling is that it inspired both editors to some significant degree. Again, similar to them as well as the IntelliJ suite, Sublime Text supports an extensive range of functionality, including:<\/p>\n
- \n
- Goto Anything & Goto Definition:<\/strong> These let you navigate through a code base almost with ease. Quite similar to IntelliJ, you can navigate via function<\/em>, class<\/em>, file name<\/em>, symbol<\/em>, and line<\/em>.<\/li>\n
- Multiple selections:<\/strong> This is a crazy feature in Sublime Text (and emulated in other editors) that lets you edit several selections of the same text block simultaneously.<\/li>\n
- Command Palette:<\/strong> This allows you to initiate almost any functionality in Sublime Text just by searching for its name and running it.<\/li>\n
- Code folding:<\/strong> Some code files, functions, and blocks can be somewhat unwieldy. Code folding lets you fold (or compress) blocks at various levels so that the file is more accessible.<\/li>\n
- Macros:<\/strong> This is basic automation, allowing you to string a series of commands together for later reuse.<\/li>\n
- Split editing:<\/strong> This allows, as in the other IDEs and editors, the ability to view multiple files simultaneously, as well as look at the same file simultaneously.<\/li>\n<\/ul>\n
It\u2019s also heavily customizable. As with the other IDEs and editors, you can, via the package manager or Package Control<\/a>, the website version of the package manager, search for an extensive range of add-on packages.<\/p>\n
![\"\"](\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/01\/packagecontrol.png\")
<\/a>Package Control<\/figcaption><\/figure>\n Focusing on Package Control, you can find packages for:<\/p>\n
- \n
- Syntax highlighting<\/li>\n
- Color schemes<\/li>\n
- Listing<\/li>\n
- Auto-completion<\/li>\n
- Theming<\/li>\n
- Text manipulation<\/li>\n
- Formatting<\/li>\n
- Build systems<\/li>\n<\/ul>\n
Then there are snippets. Snippets allow you to avoid typing the same things repeatedly, such as HTML table templates and code file boilerplate. Instead, you can set up a snippet with a trigger word, such as
class<\/code>. When you type it and press tab, you could generate the example below, for a PHP class.<\/p>\n*\/\r\nclass User\r\n{\r\n \/**\r\n * User constructor.\r\n *\/\r\n public function __construct()\r\n {\r\n\r\n }\r\n}<\/pre>\nIf you\u2019re keen to get started quickly with Sublime Text, there\u2019s also a book and video package available, called Sublime Text Power User<\/em><\/a>. It will teach you all you need to know to become a power user, by one of the best trainers out there on the web today, Wes Bos<\/a>.<\/p>\n
These are a testament to just how passionate and committed people can be to this seemingly simple editor. It has inspired a rabid following!<\/p>\n
Vim<\/h2>\n
![\"\"](\"http:\/\/www.webcodegeeks.com\/wp-content\/uploads\/2018\/01\/vim.png\")
<\/a>Vim<\/figcaption><\/figure>\n At least to my mind, no discussion about code editors would be complete without mentioning Vim (or Emacs<\/em>, Pico<\/em>, Ed<\/em>, and Nano<\/em>). No disrespect to the latter four, but Vim\u2019s been my go-to editor for several years, and one that, after you develop sufficient knowledge and muscle memory<\/a>, it will be something you will find hard to let go of.<\/p>\n
Modeled on the earlier VI, Vim is a 30+-year-old text editor that\u2019s seen a resurgence in recent years among younger developers, most notably those in the Ruby community. Why? It\u2019s hard to say. However, that it is a testament to its durability.<\/p>\n
Here are a few possible reasons:<\/p>\n
- \n
- It\u2019s been around for as long as it has, and it\u2019s in the developer consciousness.<\/li>\n
- It\u2019s available on any Unix\/Linux box you\u2019re likely to touch.<\/li>\n
- Tim Pope<\/a>. If you\u2019ve been around Vim for even a little while, you\u2019ll have heard of Tim. I think he\u2019s contributed more to the Vim community than just about anyone else, with such plugins as vim-fugitive, vim-obsession, vim-sleuth, vim-rails, vim-commentary, vim-markdown, and my favorite, vim-surround.<\/li>\n
- Drew Neil<\/a>. Drew\u2019s the host of VimCasts.org<\/a>, the site that teaches you all about Vim, one video at a time.<\/li>\n
- Books, such as the excellent Practical Vim<\/em><\/a> (also by Drew Neil), and sites such as Vim Awesome<\/a> abound, so you\u2019re never likely to be stuck on anything for too long.<\/li>\n<\/ul>\n
Moreover, if it\u2019s not already installed, it will only take a minute or two. I\u2019m not aware of any package manager that doesn\u2019t provide support for it.<\/p>\n
Unlike all of the other editors discussed here, Vim is a no-nonsense, no-frills text editor that can be customized, tuned, configured, and adjusted to suit nearly any need.<\/p>\n
From writing text and prose, such as my recently published Zend Expressive Essentials<\/em> book<\/a>, which was written in the Asciidoctor format, to maintaining the ownCloud documentation, which is written using the reStructuredText format, to writing Go applications, which you can see in the screenshot below, Vim is amazingly versatile.<\/p>\n
By default, however, it doesn\u2019t support a significant amount of functionality. However, thanks to plugins such as those by Tim and others, you can make it do almost what you want.<\/p>\n
Then on top of plugins, you can create configurations via
.vimrc<\/code> files, such as the one that I created<\/a>, to bundle both plugins and accompanying configuration together.<\/p>\nAs an example, my configuration ensures my Vim setup has support for PHP<\/em>, Go<\/em>, Ruby<\/em>, Python<\/em>, Asciidoc<\/em>, reStructuredText<\/em>, Markdown<\/em>, JavaScript<\/em>, NodeJS<\/em>, and professional writing<\/em>.<\/p>\n
In Conclusion<\/h2>\n
That has been a rapid run through of five of the most used code editors available today for web application (and other) development. As I mentioned earlier, there are just too many editors and IDEs available today to hope to cover them all.<\/p>\n
However, this has been my attempt to look at five of the best, along with a series of arguments that make them compelling choices. Is yours on the list? Would you choose any of them? Would you choose none of them?<\/p>\n
As a passionate software engineer, I would love to know your thoughts.<\/p>\n
\n - Drew Neil<\/a>. Drew\u2019s the host of VimCasts.org<\/a>, the site that teaches you all about Vim, one video at a time.<\/li>\n
- Multiple selections:<\/strong> This is a crazy feature in Sublime Text (and emulated in other editors) that lets you edit several selections of the same text block simultaneously.<\/li>\n
- The structure view.<\/strong> It displays the structure of the currently active file. In the screenshot below, you can see that it\u2019s listed the three functions received by the
- The project view.<\/strong> It shows all the files in a project.<\/li>\n