Max Schmitt

May 8 2014

5 must-have Atom packages / plugins

I'm excited about Atom because it's open source and is written in Javascript. For me it was also much easier to setup than Sublime Text. There are already many packages out there and in this post I'm sharing my favorite 5.

Video: My 5 favorite Atom packages in under 3 minutes

1. Emmet

Everybody knows Emmet and there's an Atom-package for it. Here's how it works if you don't: Just type .container and hit TAB to create a div-element with the class container.

By typing ul#emmet-pros>li.emmet-pro*3, you're telling Emmet to create this:

HTML

<ul id="emmet-pros">
	<li class="emmet-pro"></li>
	<li class="emmet-pro"></li>
	<li class="emmet-pro"></li>
</ul>

Then you can jump from one edit point to the next to quickly fill in the content.

Link: Emmet package on Atom.io

2. Fancy New File

This lets you create new files by typing a file path (with auto-complete by hitting TAB while typing), instead of using right-clicks in the tree view.

CMD + ALT + N brings up the command palette. Then you can type something like js/my-module/index.js

Link: Fancy New File package on Atom.io

3. JSHint

I think every Javascript developer is familiar with this tool and Atom actually has several packages. I chose this one because it explicitly supports .jshintrc-files.

Link: JSHint package on Atom.io

4. Atom Alignment

Highlight your variables assignments, hit CTRL + ALT + A…

…and this…

JS

var aVariable = 'some-value'
var anotherVariable = 12.5
var awesomeModule = require('awesome-module')
var that = this

…becomes this:

JS

var aVariable = 'some-value'
var anotherVariable = 12.5
var awesomeModule = require('awesome-module')
var that = this

Link: Alignment package/on Atom.io

5. Change Case

Use the command palette to convert a selection to a different case convention. Currently supported:

  • camelCase
  • snake_case
  • STATIC_VARIABLE
  • dot.notation
  • file/path

Link: Change Case package on Atom.io

What are you using?

I'm very interested in what you are using with Atom, so please leave me a comment below: Which packages are must-have for your workflow in Atom and what are you still missing?