2017-09-08

中級PHPerに！！テキストエディタ『ATOM』のススメ

今回は開発部阿部がブログを書く番です。　昔黒歴史と呼べるようなことをSNSで書いてたこともあり、なんだか懐かしみながら、更新していきたいと思います。　mixiとか懐かしすぎますよね。

今日は僕が使っているテキストエディタ Atom を紹介したいと思います。

Atomはオープンソースのエディタで、非常にたくさんのパッケージが公開されている為、自分の好みに合ったカスタマイズが可能です。

社内でAdobeライセンスを持っている方は流れで”DreamWeaver“を使っていると思うのですが、DreamWeaverに匹敵するぐらいの機能性を持たせることも可能です。

それならDWでいいんじゃ・・・と思うかもしれませんが、DWに比べると体感で分かるぐらいには動作が軽いです。 DWは起動してから一息ついて、それから作業という感じですがAtomは馬車馬のごとくサクっと起動してすぐ作業に入れます。

エディタ自体のThemes(テーマ)が豊富

Atomは見た目の変更が可能で、多くのユーザがテーマ作成し公開している為非常にクォリティが高くしかもコードが見やすいようになっています。

atom.io

ソースコード内の配色もテーマによって違ってくる為、DWがここ最近ソースコードの色調をガラッと変えてましたが、あれに近い色合いや、白を基調としたテーマもあります。

atom.io

f:id:ajdev:20170908162347p:plain

f:id:ajdev:20170908162357p:plain

2つとも　atom-material-ui　というテーマの設定から複数のカラーリングパターンが選択できます。

ちなみにこの画像左側にあるツリーのデザインもたくさんあります。

それぞれ

ツリーやタブ等のUI部分のテーマがインターフェーステーマ

先ほど紹介したようなソースコードの装飾がシンタックステーマ

この2つは別々のパッケージになり、それぞれ設定が変更可能なので、より自分の好みにあったデザインを追及することが出来て、それだけで1日費やせる楽しさがあります。

より使いやすく、機能拡張ができるパッケージが豊富

UI的な拡張ももちろんですが、やっぱり機能的な拡張が魅力的です。実際に自分が使ってるパッケージを1つ紹介したいと思います。

atom.io

変数宣言を複数行う際、=（イコール）の位置を揃えてる方にオススメしたいパッケージです。

たとえば、以下のようなソースがあったとします。

$arata = 'Hello world!';
$yanagi = 'Hello world!';
$tsuchikura = 'Hello world!';
$asada = 'Hello world!';
$inoue = 'Hello world!';
$asakura = 'Hello world!';
$ogata = 'Hello world!';

揃えたいですね、非常に。このぐらいならチマチマ一個ずつ揃えてもいいのですが、もし揃えた後に新たに宣言しないといけない変数が増えた場合どうしますか？

こんな感じに

$arata      = 'Hello world!';
$yanagi     = 'Hello world!';
$tsuchikura = 'Hello world!';
$asada      = 'Hello world!';
$inoue      = 'Hello world!';
$asakura    = 'Hello world!';
$ogata      = 'Hello world!';
$long_long_long_text = 'Hello world'; // 長い変数

発狂しますね。そんな時にこのパッケージを使い、揃えたい行を選択し Ctrl + Alt + A を押すと・・・

f:id:ajdev:20170908165054g:plain