Awesome Atom

A curated list of delightful Atom packages and resources. For more awesomeness, check out awesome.

Table of Content

Syntax
Lint
Build
Extensions
- Nuclide
Themes
Collaboration
- CodeSideStory
Uncategorized

Syntax

Language packages extend the editor with syntax highlighting and/or snippets for a specific language or file format.

Angular
Vue.js
Dockerfile
Markdown
React
Stylus
Pug
Tcl
TypeScript

Lint

In case the awesome nirvana that is linting has not yet been unleashed upon you:

lint was the name originally given to a particular program that flagged some suspicious and non-portable constructs (likely to be bugs) in C language source code. The term is now applied generically to tools that flag suspicious usage in software written in any computer language.

To enable linting, you'll need the general linter which provides the interface for the provider plugins for specific languages. The full list of current plugins can be found at atomlinter.github.io, a few examples being:

C++
- linter-clang
- linter-cppcheck
- linter-gcc - on-the-fly linting!
- linter-cpplint - checks against google style guide
CSS — stylelint
JavaScript — eslint
Python — pylama
SASS — sass-lint
Stylus — stylint
TypeScript - tslint

Build

To enable building, you'll need the general build which provides the interface for the provider plugins for specific languages and adds integrates with lint. The full list of current plugins can be found at atombuild.github.io, a few examples being:

AppleScript — oscompile
C/C++/Objective C — xcodebuild
CoffeeScript - coffee
GNU Make - make
Sass — sass
TypeScript - tsc

Extensions

Nuclide

An open IDE for web and native mobile development, built on top of Atom maintained by Facebook.

Collaboration

CodeSideStory

An Atom/Slack integration to start conversations about code right from the editor. Record screens and archive it right next to the line number to provide more context to your code.

Uncategorized

Advanced Open File

Helps Atom users to open files and folders easily. It can also creates new files and folders if they don't currently exist.

Atom Reverser

Reverses your current selections; e.g. false to true

Atom Terminal

Launch terminal app on current file's directory with "Ctrl-Shift-T" in Atom.

Autocomplete module import

Search & install npm packages from import/require statements by Algolia

Beautify

Beautify HTML (including Handlebars), CSS (including Sass and LESS), JavaScript, and much more in Atom.

Code Peek

Quickly peek and edit functions in separate files from the context of your current editor.

Color Picker

Color picker that supports HEX, HEXa, RGB, RGBa, HSL, HSLa, HSV, HSVa, VEC3, VEC4 – and is able to convert between the formats. It also inspects Sass and LESS color variables.

Copy Paste

Types in your code for your from the clipboard/buffer. Simply copy the code and hit the shortcut to watch your code being typed. Copy paste is ideal for screencasts and online courses.

CSS Declaration Sorter

Sorts your CSS, Less or Sass declarations in Atom, never gets tired. You can choose from various ready-made orders to keep your CSS tidy.

Duplicate Selection

Duplicates the selection if there is one, otherwise, duplicates the line.

Editor Config

EditorConfig helps developers maintain consistent coding styles between different editors

Emmet

Plugin which greatly improves HTML and CSS writing. Shortcuts can expand to complete set of HTML or CSS selectors.

File Icons

Adds file specific icons to atom for improved visual grepping. Works with Tree View and Fuzzy Finder and Tabs.

Fonts

Lots of monospace fonts.

Git Time Machine

It shows visual plot of commits to the current file over time and you can click on it on the timeplot or hover over the plot and see all of the commits for a time range.