スポンサーリンク

Web業界とは全く関係ない素人がATOMって凄いやんと思った機能

オープンソースのテキストエディタATOMがバージョン1.0にアップデートしました。
Web界隈ではもう一つ「恋に落ちるエディタ」として有名なSublime Textがありますが今回ATOMが正式版となったことによりブラウザ戦争ならぬエディタ戦争がついに終結か?という流れになっているそうです。

atom

さて、僕はWeb業界とは全く関係ない素人で普段の記事もWordpressのエディタやiPhoneのメモ帳に書いています。
何不自由なく記事を書いていますがこれだけ話題になっているエディタです。絶対に便利な機能があるに違い!そう思ってインストールして少しだけいじってみました。

リアルタイムプレビュー機能

メニューバーからパッケージ→MarkdownPreview→TogglePreviewと進むかショートカットキーctrl+shift+mを押すことで画面右側に白い画面が立ち上がります。これがリアルタイムプレビュー機能。

WordPressではエディタで入力した記事がブラウザで実際にどのように表示されるか確認するにはプレビューボタンを押してその都度確認しなければいけませんが、このリアルタイムプレビュー機能があれば入力と同時サクサクと確認することができます。

何この機能?めっちゃ便利やん。

h1

タグの自動補完

この呼び方であっているのか分かりませんが、最初の1文字を入力すると後に続く候補を表示してくれるアレ。
bはbold、brはline breakerと意味まで表示してくれるので入力が素早く行えます。

めっちゃ便利やん。何で誰も教えてくれんかったん?

b

Emmetでさらに爆速入力

ATOMにはパッケージ(プラグインのようなもの?)がありどんどん機能を追加していくことができます。
その一つがEmmet。これは凄い。ほんと凄い。初めて試したときは衝撃を受けました。

一般的には 開始タグ入力→記事入力→終了タグ入力 と入力しますが、このEmmetを使うとタグ入力の操作が一回で済みます。
例えばh1と入力してTabキーを押すと<h1></h1>というように展開されます。さらにカーソルはタグの間に自動で移動されるので後はそのまま入力していくだけです。
いちいちshiftを押しながら<>を押す手間が省けるので大幅なスピードアップが期待できると思います。

さらにul>li*3と入力すると・・・結果は下の画像をご覧下さい。

何なんこの凄い機能!?魔法やん

ul

ATOM凄い。めっちゃ凄い

いかがでしたでしょうか。WeB界隈の方にとっては当たり前の事かもしれませんが、素人にとってはどれもこれも魔法のように便利な機能ばかりでした。まだまだ便利な機能がたくさんあるので興味のある人は是非調べて使いこなしてみて下さい。