目次
ありがとうコードエディター
こんにちは。
梅雨明けしたはずなのに変な天気です、黒子です。
本日はコードエディターについて。
いつも大変お世話になっているコードエディター、あなたがいないことは考えられません。
以前は「Atom」というコードエディターを使っていたのですが開発終了したため、
現在は大手Microsoft開発の「Visual Studio Code(以下「VS code」)」を使っております。
移動した際は慣れませんでしたが、今ではゴリゴリ使っております。
たまにショートコードを間違えます…
ということで!
今回は私が使用している拡張機能とよく使うショートコードをご紹介します。
拡張機能「Japanese Language Pack for Visual Studio Code」
読んでその名の通り、VS codeを日本語化します。
VS codeは初期段階では英語表記になっております。
私は生粋の日本人、英語は単語くらいしか分かりません。
そんな私を助けてくれる必須の拡張機能です。
英語が苦手な方はとりあえず入れることをおススメします。
拡張機能「vscode-icons」
フォルダやファイル横にアイコンを付けてくれます。
ぱっと見で何のファイルなのか分かりやすくなります。
たくさんの拡張子に対応しています。
ちなみにアイコンを付ける拡張機能は他にもあります。
自分の好きなものを使われてください。
拡張機能「Auto Rename Tag」
タグをリネームした際、閉じタグも自動的にリネームしてくれます。
例えばPタグをDIVタグに打ち直すときに、開始タグと閉じタグを変更する必要があります。
近くにあるならいいのですが、かなりの行数があるときは探して変更するのに一苦労ですよね。
そんなことしなくていいのがこの「Auto Rename Tag」
勝手に変更してくれます。
拡張機能「indent-rainbow」
インデントを見やすくしてくれます。
コーディングする際、自分が作業しやすくするためインデントを必ず綺麗に並べています。
どのタグがどの閉じタグに連動していて、どこまでを囲っているのか目視で確認するためです。
それをもっと分かりやすくしてくれるのがこの「indent-rainbow」
色をつけてくれるのでとても見やすい。
拡張機能「PHP Intelephense」
PHPの開発をする際にとても便利。
私は主にWordPressを開発するためPHPを多用します。
そんな私にピッタリの拡張機能。
出来ることがたくさんあるのですが、私が特に使っている機能は以下の2つ。
【コード補完】
例えば「div」と入力するだけで候補が出てきて、選択すると閉じタグまで出してくれます。
【文法の誤りチェック】
見逃しやすい文法をチェックしてくれます。
括弧1つでも無いとエラーになるので、大変助かります。
拡張機能「Project Manager」
ワークスペースやフォルダーを簡単に切り替えられます。
いくつかの作業を抱えているとき、わざわざデータを開いて…というのは面倒。
それをVS code内で切り替えられる素晴らしい拡張機能。
しかも開いているテキストフォルダを保存しておいてくれる機能付き。
前に何のデータを触ったか分かりやすくなります。
よく使うショートコード
ここではVS codeでよく使っているショートコード(Windows)をご紹介。
【Ctrl + Shift + P】
コマンドパレットを開きます。
【Ctrl + F】
開いているテキストフォルダ内での検索。
【Ctrl + Shift + F】
開いているワークスペース内での検索。
【Ctrl + H】
開いているテキストフォルダ内での置換。
【Ctrl + Shift + H】
開いているワークスペース内での置換。
【Alt + Z】
折り返しの切り替え。
【Shift + Alt +F】
コードを綺麗に整えてくれます。
コピーや貼り付け、保存などは他のツールと変わらないので割愛。
とにかく使ってほしい
拡張機能はインストールするだけで機能するので、ぜひ使ってください。
コーディングのスピードがとても早くなります。
ショートコードも数個しかお伝えしていませんが、もっとあります。
コードエディター「Visual Studio Code」をもっと便利に使って
ストレスフリーなコーディングを目指しましょう!
それではまたー。
黒子
宮崎南印刷 デジタル事業部所属。目に多大なるダメージ受けながらコーディングをぽちぽちやってます。他にもやってみたいことはあるけど手を出せていない。小学生から続くゲーマー、社会人になった現在も絶賛ゲーム楽しんでます。ラーメン、カレー、パスタなど小麦粉使ったら大体好き。