In short, Atom editor by GitHub is well-built, focused on code (there isn’t really anything getting in your way), similar to Sublime.
Now I haven’t used Sublime beyond basics and generally favour GUI, rather than command line. Everything can be found via CTRL+SHIFT+P. However, if something can be typed with 5 characters, and it could have also been called with 2 keystrokes, I’d choose the keystrokes approach. I’m not a Sublime user, you guessed it right, won’t be paying 70$ for a fancy text editor, if WebStorm is worth 59$. Not an affiliate of JetBrains, just common sense.
TL;DR version is at the bottom of this page - under Summary.
Options for color schemes are very good, I found a really great dark theme, this coming from a user who never used dark themes on anything yet. If you are like me, try it out, their dark theme is excellent. I used “One Dark” for UI Theme and “Base16 Tomorrow Dark” for Syntax Theme. In my opinion, these make a great combination together. Not to mention that you can install custom themes as well. With all my current plugins, Atom looks like this (details to follow):
To me it looks great, makes you want to write some code. Unfortunately, it does not work like this out of the box, so below I will describe plugins, which help make Atom more usable.
The good - what worked:
color picker package - somehow the key combination does not do anything (CTRL+ALT+C), so I had to use the right click menu. Nothing bad really, but it could have been integrated as part of “pigments” package - see screenshot.
minimap - very useful, gives you overview of your code, so you can easily navigate to the relevant part. It’s not commonly recognized that code has shape, but I believe in this. In fact, if you can distinguish the place in code by shape, you probably have good quality code. On the other hand, if without reading line by line, your code looks the same, it probably was not yet refactored.
pigments - displays color inside the CSS file, but does not allow you to change it. Really? Would you not want to change it by clicking on the icon with a particular color? I have to install a separate package, which has other issues, already described above. Side note here - if you don’t like how it displays the color, there are ways to change it in configuration, so don’t give up just because the default isn’t very sexy. For the screenshot of how I had it set up - see color picker bullet point, to the left of line 37 (and 51 too).
remote-sync - works well over FTP after several hickups. For those of you who don’t know what this does - it uploads a file to a remote server after every change. Very convenient to see live changes immediately, whether on production or staging server. The only issue - does not report status, i.e. you never know if it’s working or not. You can expand its window, but then it’s taking desktop space, where code should be instead. I’d expect a popup whenever files are uploaded, or some status bar showing upload progress. Even a simple indication would be nice (spinning wheel, anything really). Internally has a JSON config, but there is GUI to do the same, I used GUI.
The bad - what didn’t work (and I really hoped it would):
- Git integration from the IDE (and probably source control in general, haven’t tried SVN or other VCS). Tried several plugins - all of them were either garbage or inefficient. Commit/push is probably the most common operation I would do - it should be one-click operation. Toolbox, keystrokes, does not matter, what’s important is that I must be able to review my changes before commit, diff included. If conflicts, resolve. Ideally some validation on HTML/CSS, and do not commit if there are “common” issues, like HTML5 not passing W3 validation. Important here - Atom knows which files were changed, highlighted with different colors, but cannot explain why and what exactly was changed.
People can say “use command line” or TortoiseGit (which I have installed, just lazy to minimize Atom, navigate in Explorer/Total Commander and use from the right click menu) - I prefer the IDE to have everything in it.
Good example - there simply isn’t anything to compare with the level of convenience offered by WebStorm/PhpStorm.
Challenge - if you know better than the above diff view, feel free to drop me an email. If I find it decent, the article will be updated and you will get a credit. Side note - I already know about Beyond Compare, Araxis Merge, Code Compare by Devart, WinMerge and many others.
Summary
Overall, I spent 2 hours straight (no breaks for coffee), trying to make things work and really hoping it would suffice my basic needs. Unfortunately, integrated support for version control is crucial. Atom editor is fairly new, many important plugins are community authored, and most of them are poor quality, i.e. they work, but often you see display artifacts/glitches. Not a production quality product, but hopefully in 2-3 years from now, we’ll see a strong competitor to JetBrains and others. It’s free though, so you may still give it a try and - because it’s open source - help develop.
