「SublimeText」から「VSCode」に乗り換えを決めた「13」の理由

ずっと同じツールを使い続けていると「乗り換えが時が超めんどくさいな〜」と思う人が多いと思います。しかしながら「VSCode」を使ってみると初期設定がほとんどないことに気がつきます。

その昔SublimeTextの初期設定する際は、なんか色々面倒な設定をした記憶が残っていましが、VSCodeの方の初期設定はほとんどすることがないです。強いて言えば日本語化する拡張機能をインストールすればスムーズに使い始めることができます。拡張機能をインストールと言っても、検索で探して、ぽちぽちクリックを押していけばインストールが完了するので、超簡単ですよ。

ここは、重要なポイントでしょう。作業をサクサク進めるためには動きが速くなければ、ストレスになる。

VSCodeはWebの技術(JavaScriptなど)をベースとしているので「軽い」さらに「高機能」そして「無料」。これはSublimeTextと同等レベルである。

これは、無料版を利用している人はお分かりいただけると思うが、ワタシにとって唯一の苦痛である「最新版の更新を促すポップアップ」と「有料を促すポップアップ」が出ること。

これがストレス ↓

これもストレス ↓

黙々と作業をしているときの、このポップアップが出た瞬間、何回イラッとしたことか。。。これは正直、致命的な仕様だったでしょう。なぜなら、これまでは頻繁に出現する「ポップアップ」に我慢していたけど、ポップアップがでない「軽くて」「高機能で」「無料版」のテキストエディタ「VSCode」が登場してしまったのだから。

長い間SublimeTextを使っていたので、デフォルトの配色に慣れてしまった。でも心配無用！SublimeTextと同じような見た目で使えるんです。そして設定も超簡単なんです。
Code ⇒ 基本設定 ⇒ 配色テーマ ⇒ Monokai をクリックするだけ。やっぱりこの配色が最高です！完璧ではないですが 90％ SublimeTextそっくりです！

command + shift + Dは選択した行をコピーしてペーストを１発でこなす、超絶便利でよく使う機能です。

SublimeTextでも同じ操作ができます。サンプルの例はcommand + shift + Dを6回押しています。

この言葉の表現はなかなか説明が難しいので動きを見てもらったほうが理解がはやいでしょう。要するに「長方形の形」でのテキストを選択できる機能ということです。ワタシの場合は矩形（くけい）選択機能を重要視していて、SublimeTextが「矩形（くけい）選択」ができるから利用していた。と言っても過言ではないです。矩形（くけい）選択と言えば、たしかTerapad(テラパッド)や秀丸(ひでまる)やサクラエディタという名のテキストエディタが「矩形（くけい）選択」が使用できたので使っていた記憶がある。

この、矩形（くけい）選択の操作方法は若干、各エディタごとに異なるが VSCodeのサンプルの例では、shift + option + 下方向へドラッグしながら右方向へドラッグしている。※慣れるまで少し難しいかもしれませんが、ぜひ練習してみてください。

ターミナル（コマンドライン）との連動は非常にありがたい。ワタシは常にコーディングと同時にターミナルを動かしたり、コードの圧縮などでターミナルを使うので超便利である。

また、VSCodeを開いた状態で command + shift + C を押すと新規で個別ターミナルが開く。ターミナルが開くとパスはワークスペースのパスになっているので、これはこれで割と使いやすいですね。

SublimeTextでは、複数のプロジェクトを同時に切り替えて同時に使うことができたけど、なんかいまいち。。。という印象。
VSCodeで管理する場合は「xxxxx.code-workspace」という拡張子です。ワタシの場合はこんな感じでサイトごとに分けて管理してます。VSC_を最初につけることでワークスペースのファイルかどうかを、すぐにわかるようにしてます。
これ ↓

というのも、ワークスペース毎にターミナル（コマンドライン）を連動できることが、非常に使いやすいのです！この感覚を伝えるのが難しいのですが、ワタシの場合「１つのプロジェクト毎に１つ以上のターミナルを使う」ので、この条件が満たされていることが非常に良いということです。

ファイルの複製という地味な機能だけど、SublimeTextにはデフォルトでは、ツール上でファイルを複製する機能がない。ワタシが知らないだけかもしれないが、やり方がわからないので、SublimeTextの拡張機能をインストールしてファイルの複製をしていた。これに比べてVSCodeの方はデフォルトでファイルの複製機能が付いている。やりかたは簡単で、複製したいファイルの上にカーソルを置いて command + C でコピーして、 command + V で貼り付ける。間違えた場合は command + Z で取り消すことができる。

さらに、拡張機能の「Duplicate action」をインストールすることで、ファイルをコピーして同時にファイル名を任意でつけることが可能になる。この拡張機能は、なくても良いがあったら便利である。

拡張機能で Duplicate action を検索してインストールボタンをポチッと押すだけ ↓

Duplicate action インストール後のコピーのやり方 ↓

主に、ローカル開発をしているときにローカルサーバ構築の知識がなくても、ワンクリックでwebページの表示確認ができる優れもの。

LiveServerをインストールすれば、コードを保存して、ブラウザをリーローして、確認して、またコードを保存して、ブラウザをリーローして、、、という作業の繰り返し地獄から解放してくれます。SublimeTextにもこの類のプラグインがあったと思うが、インストールから、実行まで超簡単にできます！

Go Liveボタンを押すだけでローカルサーバが起動して、該当のファイルを保存するたびに、webページがブラウザで更新されます。この拡張機能は使わないと損です。

VSCodeでは、さまざまな言語のプログラムをデバッグできます。
これがめちゃくちゃ便利です！とにかく色々なデバッガー拡張機能があるので、自分自身が扱っている言語に合わせて拡張機能をインストールします。ワタシの場合はひとまず「PHP Debug」で十分です！（使いこなせていないので勉強中）とにかく、すごーいたくさんの言語に対応しているので、是非探してみてください。

WordPressのデバックもできた（wordpressコアのファイルに行ったり来たりするので、よくわかなかった）ので、ある程度、勉強してまとめることができたら記事公開します。

お待たせしました！これです。ワタシの場合この機能を使えることを確認したときに「SublimeText」から「VSCode」に乗り換えを決意しました。まず、設定が超簡単だった！「sftp.json」にサーバの情報を記述するだけでリモートサーバと通信できます。SublimeTextも同じことができるのだが、VSCodeでもできるとなると、総合ポイントでVSCodeに軍配が上がる。

しかしながら、SublimeTextでは可能であった「リモートサーバのディレクトリを見る」ことがVSCodeでは、できないです。。。唯一残念なマイナスポイントです。これって超便利なんです！「リモートサーバのディレクトリを見る」機能をどうにかバージョンアップして欲しい限りです。

VSCodeからGit（バージョン管理システム）を使うことができる。まあ、これはSublimeTextでも同様なことができますね。

GitHub(ギットハブ)を新規で登録する手順はこちら「GitHubの新規アカウント登録方法とアカウント削除する方法」の記事にまとめています。
ちなみにワタシの場合はGitHub Desktopというツールを使いVSCodeと連携しています。