🙌

RailsでのWebアプリ開発に愛用している Atom プラグイン

3 min read

Ruby on Rails でWebアプリを開発しています。
便利だなと思ったプラグインをまとめてみました。

HTML

  1. カラーピッカー
    color-picker
  2. html/css中のカラーコード(#fff)を背景色(白)で表示
    pigments
  3. HTMLソースをライブプレビュー
    atom-html-preview
  4. HTMLをとっても簡単に入力
    emmet
    docで、<html>(略)</html>に変換
    table>tr>td*3で、<table>(略)</table>に変換など、とても便利。

    ctrl-e で変換が既定値だが、「行末へ移動」と重複しているので、ctrl-,で変換されるよう、変更する。

    Open Config Folderをクリック、keymap.csonに以下を追記する。
    <pre>
    'atom-workspace atom-text-editor:not([mini])': 'cmd-t': 'application:new-file'
    '.editor:not(.mini)': 'ctrl-e': 'editor:move-to-end-of-line'
    'atom-text-editor:not([mini])': 'ctrl-,': 'emmet:expand-abbreviation'
    '.platform-darwin atom-text-editor:not([mini])': 'ctrl-d': 'unset!'
    </pre>

見た目を綺麗に

  1. ファイルの種類に応じたアイコンを表示
    file-icons
  2. カーソルがある列を強調表示
    highlight-column
  3. 選択箇所を強調表示
    selection-highlight

日本語化

  1. メニューバーとコンテキストメニュー、設定画面を日本語化します。
    japanese-menu

ソースコードを綺麗に

  1. ソースコードを綺麗に整形
    atom-beautify
  2. ソースコードの=を綺麗に並べてくれる
    atom-alignment

機能拡張

  1. 複数のプロジェクトをatom内で簡単にスイッチ
    project-manager
  2. atom内にterminalウィンドウを表示
    platformio-ide-terminal
  3. ファイルやディレクトリの作成が簡単に
    advanced-open-file
  4. 簡単に全角半角の変換
    japan-util
  5. ターミナルを使わずにgit操作
    git-plus
  6. Atomの設定の同期やバックアップに
    sync-settings
  7. ATOM上で開いているファイルのexpose
    expose
  8. AIによるコード補完機能
    tabnine

Markdown

  1. markdownをライブプレビュー
    markdown-preview-plus
  2. markdownで表を簡単に作成
    markdown-table-editor
  3. markdownで目次を簡単に作成
    markdown-toc
  4. Atom をより良い markdown エディタにするために
    markdown-writer
  5. csvファイルをexcelライクに表示
    tablr

Rails

  1. Atom 上で slim を使うために
    language-slim
  2. railsのmvcファイルを簡単に見つける
    rails-finder
  3. railsのmigrationファイルを簡単に見つける
    rails-latest-migration
  4. railsで簡単にpartialを作れる
    rails-partials
  5. rubyのメソッドを簡単に入力
    ruby-define-method
  6. ソースコード中のメソッド定義を検索
    symbols-tree-view
  7. 正規表現をダイアグラムで表示
    regex-railroad-diagram

Discussion

ログインするとコメントできます