My Atom editor setup.

atom-setup.md

My Atom editor setup

Atom

• Install Atom from https://atom.io/.

Atom Shell Commands

• Launch Atom and select "Atom - Install Shell Commands" menu to install atom and apm commands
• Add /usr/local/bin to PATH environment varibale
  • Now, you can load file from terminal with atom [directory or file]

Plugin packages

Install following plugins.

Emacs-like:

• clipboard-plus - Keeps your clipboard history.
• disable-keybindings - Disables keybindings.
• emacs-plus - Emacs-like experience in the Atom.
• sort-lines

Git:

• git-blame - Toggle git-blame annotations in the gutter of atom editor.
• tree-view-git-status - Show the Git repository status in the Atom tree-view.

Appearance:

• file-icons - Assign file extension icons and colours for improved visual grepping.
• pigments - A package to display colors in project and files.

Linting:

• linter - A Base Linter with Cow Powers.
• linter-coffeelint - Lint CoffeeScript on the fly, using coffeelint.
• linter-elixirc - Bare Minimum Elixir lint package.
• linter-erb - Linter plugin for ERB, using erb -x.
• linter-eslint - Lint JavaScript on the fly, using ESLint.
• linter-jsonlint - A plugin for Atom Linter providing an interface to jsonlint.
• linter-ruby - Lint Ruby on the fly, using ruby -wc.
• linter-rubocop - Lint Ruby on the fly, using rubocop.
• linter-scss-lint - Lint SCSS on the fly, using scss-lint.
• linter-stylelint

IDE:

• atom-ide-ui - Atom UIs to support language services and debuggers as part of Atom IDE
• ide-css - Atom-IDE for CSS, LESS and SCSS language
• ide-json - JSON language support for Atom-IDE, powered by VSCode JSON Language Server
• ide-python - Python language support for Atom-IDE, powered by the Python language server
• ide-rust - Rust language support for Atom-IDE, powered by the Rust Language Server (RLS)
• ide-yaml - Atom-IDE support for YAML language

JavaScript support:

• language-babel - ES2017, flow, React JSX and GraphQL grammar and transpilation for ATOM
• language-graphql - Syntax highlighting for GraphQL queries
• prettier-atom - Atom plugin for formatting JavaScript using prettier with (optional) prettier-eslint integration

Elixir support:

• autocomplete-elixir - Intelligent elixir code completion.
• language-elixir - Elixir language support for Atom.

Rails support:

• rails-i18n-autocomplete - Autocomplete provider for rails i18n files.
• rails-transporter - Open related Rails files depending on current context.

Arduino support:

• language-arduino - Arduino support in Atom

Misc:

• advanced-open-file - Open and create files and directories easily. Type in a path (with autocomplete) and view directory contents.
• atom-fuzzy-grep - Fuzzy grep project using ag, pt, ack, grep or git-grep.
• highlight-line - Highlights the current line in the editor
• highlight-selected - Highlights the current word selected when double clicking.
• japanese-word-selection
• project-manager
• remember-file-positions - Remembers the last position a file was open at even if that file has since been closed. Inspired by Vim's file marks.
• todo-show - Finds all the TODOs, FIXMEs, CHANGEDs, etc. in your project.

Theme packages

Install following themes.

• isotope-ui - A clean and configurable UI theme.
• nord-atom-ui
• ariake-dark-syntax

Tips

• Atom や Sublime Text で日本語の単語移動を可能にする（Vim化プラグインでも有効） - Qiita

init.coffee

process.env.LC_CTYPE = 'ja_JP.UTF-8'

keymap.cson

'.platform-darwin':
  'cmd-p': 'command-palette:toggle'
  # project-manager
  'ctrl-cmd-p': 'project-manager:list-projects'
'.platform-darwin atom-text-editor:not([mini])':
  'alt-y': 'clipboard-plus:toggle'
'body':
  'cmd-w': 'core:copy' # Disable core:close
  # Disable tab select by recent use
  'ctrl-tab ^ctrl': 'unset!'
  'ctrl-tab': 'pane:show-next-item'
  'ctrl-shift-tab ^ctrl': 'unset!'
  'ctrl-shift-tab': 'pane:show-previous-item'

'atom-workspace':
  # atom-fuzzy-grep
  'ctrl-alt-g': 'fuzzy-grep:toggle'
  # rails-transporter
  'alt-r c': 'rails-transporter:open-controller'
  'alt-r v f': 'rails-transporter:open-view-finder'
  'alt-r v': 'rails-transporter:open-view'
  'alt-r l': 'rails-transporter:open-layout'
  'alt-r m': 'rails-transporter:open-model'
  'alt-r h': 'rails-transporter:open-helper'
  'alt-r t': 'rails-transporter:open-test'
  'alt-r s': 'rails-transporter:open-spec'
  'alt-r p': 'rails-transporter:open-partial-template'
  'alt-r a': 'rails-transporter:open-asset'
  'alt-r d m': 'rails-transporter:open-migration-finder'
  'alt-r f': 'rails-transporter:open-factory'

snippets.cson

# Your snippets
#
# Atom snippets allow you to enter a simple prefix in the editor and hit tab to
# expand the prefix into a larger code block with templated values.
#
# You can create a new snippet in this file by typing "snip" and then hitting
# tab.
#
# An example CoffeeScript snippet to expand log to console.log:
#
# '.source.coffee':
#   'Console log':
#     'prefix': 'log'
#     'body': 'console.log $1'
#
# Each scope (e.g. '.source.coffee' above) can only be declared once.
#
# This file uses CoffeeScript Object Notation (CSON).
# If you are unfamiliar with CSON, you can read more about it in the
# Atom Flight Manual:
# https://atom.io/docs/latest/using-atom-basic-customization#cson

# language-ruby-on-rails
'.source.ruby.rails, .text.html.ruby, .text.haml, .source.js.rails':
  'erb_render_block':
    'prefix': '='
    'body': '<%= $1 %>'
'.source.ruby.rails, .text.html.ruby, .text.haml':
  'erb_exec_block':
    'prefix': '-'
    'body': '<% $1 %>'

styles.less

/*
 * Your Stylesheet
 *
 * This stylesheet is loaded when Atom starts up and is reloaded automatically
 * when it is changed and saved.
 *
 * Add your own CSS or Less to fully customize Atom.
 * If you are unfamiliar with Less, you can read more about it here:
 * http://lesscss.org
 */

 // style the background and foreground colors on the atom-text-editor-element itself
 atom-text-editor.editor {
   .syntax--comment {
     font-style: normal;
   }
 }

 @custom-font-family: 'Fira Code';
 @custom-font-size-s: 14px;
 @custom-tree-view-color: #b0bec5; // Blue Grey 200

// nord-atom-ui
// .tree-view {
//   .project-root {
//     & > .header {
//       & .name {
//         color: @custom-tree-view-color;
//         font-family: @custom-font-family;
//         font-size: @custom-font-size-s;
//         font-weight: normal;
//       }
//     }
//     & > .entries {
//       .list-item {
//         color: @custom-tree-view-color;
//         font-family: @custom-font-family !important;
//         font-size: @custom-font-size-s;
//         font-weight: normal;
//       }
//     }
//   }
// }

// tree-view-git-status
.tree-view-git-status {
  font-family: @custom-font-family;
  font-size: @custom-font-size-s;
  font-weight: normal;
}