ブログ記事を書いたり、あるいはプログラミングを行なったりと、様々なシーンで活躍するテキストエディタ。
ライターやエンジニアの方であれば、何かしらのテキストエディタを利用されているのではないでしょうか。

Windowsには「メモ帳」、Macには「メモ」アプリが標準で使えるようになっていますが、コードを色分けして、テキスト編集以外の面での使いやすさを求めるのであれば、これら標準アプリだと少し物足りないと感じる方もいるでしょう。

そこでチェックしておきたいのが*「Sublime Text」*です。
このアプリを使えば入力補完ができたり、タブで編集するテキストを切り替えたり、プラグインによって機能を拡張したりすることもできます。

今回は、2013年からのβ版運用を経て2017年9月に正式にリリースされた*「Sublime Text 3」*の特徴や使い方を、初心者向けに解説します。

Sublime Textとは?

Sublime Textは、高機能なテキストエディタです。
macOS版とWindows版があり、ライセンス購入をする際には1回でOK。
設定ファイルを一度作ってクラウドストレージで同期を行うことで、設定変更を行う必要もありません。

また、動作が軽快にもかかわらず汎用性が高く、PackageControllと呼ばれるプラグインを使ったりPhythonによってコードを書いたりすることで、デフォルトにはない機能を追加することもできます。

Sublime Textはバージョン3を2013年から継続的にβ版としてビルド番号を重ねてきましたが、今回正式版としてリリースされました。
起動の速さやファイルを開く速度、スクロールなどのパフォーマンスも向上しており、初心者から玄人まで満足のいくテキストエディタとなっています。

Sublime Text 3を使ってみよう

ここではMac版のダウンロード&インストール方法をご紹介しますが、基本的にはWindows版も同じ手順を踏んでいきます。

1. Sublime Text 3のダウンロード

1.png
スクリーンショット:2017年9月

Sublime Text 3の公式ページをブラウザで開き、*「DOWNLOAD FOR MAC」*のボタンを押して、ファイルをダウンロードします。

2. dmgファイルを展開してアプリケーションフォルダにコピー

ダウンロードすると、ソフトウェアの入ったdmgファイルがダウンロードされます。

2.png
スクリーンショット:2017年9月

ダウンロードしたdmgファイルをダブルクリックすると、ソフトウェア本体とアプリケーションフォルダのショートカットが用意されているので、ファイルをアプリケーションフォルダにドラッグ&ドロップしてコピーします。

21.png
スクリーンショット:2017年9月

3. LaunchpadからSublime Text 3を起動

コピーが完了したら、アプリケーションのフォルダからSublime Text 3のアイコンをクリックして実行します。

3.png
スクリーンショット:2017年9月

その際、以下のような警告が出てきます。

4.png
スクリーンショット:2017年9月

ここは、*「開く」*をクリックして次に進みましょう。

5.png
スクリーンショット:2017年9月

ソフトが無事に起動できたら完了です。

PackageControllを使ってみよう

Sublime Text 3は、基本的には他のテキストエディタと使い方は同じなので、起動したらすぐに使うことができるでしょう。
しかし、Sublime Text 3が他のテキストエディタと違う点の一つは、PackageControllと呼ばれるプラグイン機能が利用できるところです。

PackageControllを導入することで、PHPやJavaScript、Pythonなどの構文を自動でチェックしてくれたり、自動補完やハイライトを行ったりすることができます。

ここでは例として、ブラケット(かっこ)の開始と終了を強調してくれる「BracketHighlighter」をダウンロードしてみましょう。

6.png
スクリーンショット:2017年9月

まず、メニューバーのPreferencesからPackageControllを開くか、Ctrl+Shilt+Pで直接PackageControllを開きます。
(メニューに出てこない場合には、その前にToolsPackageControllをクリックしてPackageControll自体をインストールしてみてください)

7.png
スクリーンショット:2017年9月

次に、表示されたコマンドラインに*「Install Package」*を入力します。

8.png
スクリーンショット:2017年9月

ロード後表示されるコマンドラインにPackageControll名を入力します。
ここでは*「BracketHighlighter」*を入力します。

9.png
スクリーンショット:2017年9月

無事にインストールできたら、このように補足説明が記されたファイルが表示されます。

おすすめPackageControll ベスト5

ここでは、Sublime Text 3に入れておきたい、オススメのプラグインの名前と簡単な概要を紹介していきます。
気に入ったものがあったらぜひ入れてみてください。

1. Japanize

Japanizeは、その名の通りSublime Text 3を日本語化してくれるパッケージです。
全てのメニューが日本語化されるわけではありませんが、よく使うメニューはほとんど日本語化されるので、ぜひインストールしてみましょう。

2. AlignTab

AlignTabを適用すると、コードを見やすく整列してくれます。
CSSを入力する際にコロン(:)を中心に整列したいといったときに活躍します。

使い方は簡単で、整列したい場所にカーソルを合わせて右クリックし、Align Byを選択します。

aligntab.gif
スクリーンショット:2017年9月

すると、このようにコロンを中心に揃えることができました。

3. All Autocomplete

allautocomplete.gif
スクリーンショット:2017年9月

All AutocompleteHTMLCSSなどのコードを補完してくれるパッケージです。
長いコードを入力する際に、以下のように必要なプロパティも含めながらコードを生成してくれて、手打ち入力とくらべてはるかにミスを減らすことにもつながります。

4. Markdown Extended

markdownextend.png
スクリーンショット:2017年9月

Markdown Extendedは、Markdownをシンタックスハイライトするパッケージです。
太字やリンクなどを、見やすく色分けしてくれます。

5. Emmet

emmet.gif
スクリーンショット:2017年9月

Emmetは、コーディングを圧倒的に速くするための入力補助プラグインです。
スニペットを記述して、Ctrl+Eで展開するという操作で、まとまったコードを一気に記述することができます。

Webデザイナーの中には、もはやこれなしでは仕事ができない、と言われるほどに便利なプラグインです。

まとめ

Sublime Text 3はカスタマイズ次第で非常に使いやすくなりますが、パッケージを入れすぎてしまうとかえって使いにくくなることもあります。
自分に必要なものを厳選してパッケージを入れてみましょう。