Friday, May 27, 2016

12 Favorite Atom Tips and Shortcuts to Improve Your Workflow

Atom is the code editor released and maintained by the GitHub team. Released in 2014, the “Sublime Text killer” has over 1.1 million monthly users, and it’s no surprise: easily expandable, customizable and hackable, the IDE has become the favorite of many developers.

Despite its wide use, I often see competent developers taking the long way around to do things, or not knowing about its true potential. This post explores some tricks for improving your Atom workflow. I’m hoping that, by the time you’ve finished, you'll have learned at least one new trick you can't live without.

Note: Although this post is for Atom users, a lot of these tips and shortcuts also work in Sublime Text.

Tips

The first stop is some general Atom tips. There options you can enable, features the IDE has, and menu settings you never knew existed. It's worth having a look through all the menu options --- as you might spot something you never knew was there!

Multiple Cursors

On of the most impressive features of Atom is its multiple cursor support. This enables to you type many things at once, on multiple lines, anywhere in the document. Just hold cmd and click in every place you want to type. There are also other ways to get multiple cursors --- but we'll cover them later with keyboard shortcuts.

multiple cursors

Auto Indent

One annoyance I have is when I copy code from somewhere and the indentation is all over the place. Luckily, Atom has you covered. Select the code and head to Edit > Lines > Auto Indent. This should copy the current indentation on the file to correct your code.

auto indent

To speed this up, I’ve created a custom keyboard shortcut, enabling me to use Ctrl + Cmd + ] at any point. To do the same, go to Atom > Keymap and paste the following:

'atom-text-editor':
    'ctrl-cmd-]': 'editor:auto-indent'

Show invisibles

To make sure the document and all lines are using the correct indentation, I've enabled invisibles in my editor. This shows ··· for space indentation, » for tab and ¬ for new line characters. This helps you see exactly where you have mixed tabs and empty news filled with spaces.

Although it makes your screen feel "busy" to begin with, you soon get used to it, and I now find it invaluable.

To do this, go to Atom > Preferences > (Scroll Down) Show Invisibles.

preference settings

Soft wrap

I despise having to scroll left and right and up and down, so to make sure there's only one direction, I've enabled soft wrap in Atom. This makes sure nothing goes off the edge of the screen but wraps around. If it has wrapped the line, it indents it to the same level as the previous line and replaces the line number in the gutter with a ·.

To enable this option, it’s a few checkboxes down from the Show invisibles option in Atom > Preferences > (Scroll Down) Soft Wrap.

Character case convert

Sometimes you have text that's the in wrong case. You might want all uppercase, or you may need to convert a SHOUTY SENTENCE to all lowercase. Located in the Edit > Text menu is some clever text manipulation tools, including Upper Case and Lower Case functions.

character case conversion options

Continue reading %12 Favorite Atom Tips and Shortcuts to Improve Your Workflow%


by Mike Street via SitePoint

No comments:

Post a Comment