【テキストエディター】ATOMを使ってみる

文字列の検索・置換もやりやすいUIだと、新旧ファイルの差分（DIFF）も簡単に見れるので初心者が使っても便利だと思います。

導入

ダウンロード先

https://atom.io/

上記からDLしてインストールします。

メニューの日本語化

パッケージのjapanuese-menuを導入する（※パッケージのインストール方法が後述）

画面のスキンの変更

メニューバーの「ファイル」＝＞「環境設定」＝＞「テーマ」のところで変更できます。標準でも数個用意されています。追加も可能です。白っぽい方が好みなので、Atom Lightに変更しました。

パッケージのインストール方法

メニューバーの「ヘルプ」＝＞「ウエルカムガイド」からたどるのが、他の人に説明するのにわかりやすいかと思います。その中の「Install Package」を選択するとパッケージ導入画面にいけます。

導入したいパッケージ名で検索をすると、候補が出ているので、インストールしたいパッケージを選択してインストールします。

困った時メモ

メニューバーが消えてしまった

1.Ctrl + Shift + P 押下
2.toggle と入力
3.Window:Toggle Menu Bar を選択
メニューが表示される
Atom でメニューバーが消えてしまった時 - Qiita

メニューバーを間違って消してしまったときは、上記の方法で元に戻せます。

行番号が消えた、表示したい

メニューバーの「ファイル」＝＞「環境設定」＝＞「エディター設定」の下の方の「行番号を表示」をチェック

タブなどを表示したい

メニューバーの「ファイル」＝＞「環境設定」＝＞「エディター設定」の下の方の「不可視文字を表示」をチェック

※注意　これでも、全角スペースは見えないみたい

全角スペースをわかりやすく表示したい

show-ideographic-space パッケージを導入してください

２分割表示したい

メニューバーの「ファイル」＝＞「表示」＝＞「ペイン」

良いところ

フォルダツリーが表示できる点がなにげに便利かなと思いました。消すこともできます。複数ファイルを編集してると、こういうのがあると便利ですよね。

検索・置換

メニューバーの「検索」のところの「検索」「置換」です。画面構成は上記のようになっていて、検索しながらそのまま置換したりと結構便利に使えるようになってます。

差分(DIFF)

split-diff というパッケージを導入してください。

パッケージを導入すると、こんな感じでファイルの差分が表示できるようになります。修正前と修正後のファイルをつかってファイルの修正箇所のチェックをするなどの時に非常に便利かと思います。

参考

・コードエディター「Atom」が統合開発環境に ～GitHub、「Atom IDE」を発表 - 窓の杜
・［保存版］Atomエディタ 便利なパッケージ一覧！ 全23社のWebエンジニア・デザイナーがおすすめを紹介 - エンジニアHub｜若手Webエンジニアのキャリアを考える！