こんにちは、マネージャーのJackです。
今回は、Microsoftが公開している無料で利用できるエディタ「Visual Studio Code（以下、VSCode）」のプラグインに関してお話できればと思います。
Visual Studio Codeとは？
VSCodeとは、Microsoftによって開発されたソースコードエディタです。Gitクライアントの統合や、シンタックスハイライトなど、プログラミングをする上で必要な機能が一通り揃っているエディタです。Windows、Linux、macOS上で動作するのも便利ですよね。
▼詳細はこちら
https://code.visualstudio.com/
便利なプラグイン5選
では、さっそくプラグインを紹介していきます。
1. vscode-icons
各ファイルの拡張子を判別し、アイコン化してくれるプラグインです。
ファイル数が増えた場合、どの拡張子のファイルなのかを一目で確認できるのって、作業効率をアップさせる上で非常に重要ですよね。このプラグインを導入すれば、それが一瞬で実現できます。
vscode-icons – Visual Studio Marketplace
2. Markdown PDF
私は、議事録などのドキュメントをMarkdown形式で記述するのですが、このプラグインはMarkdown(.md)ファイルをPDFに変換するプラグインです。案件でクライアントさまへドキュメントを共有する際にも便利です。
Markdown PDF – Visual Studio Marketplace
3. REST Client
続いて便利なプラグインが「REST Client」です。
これは、VSCode上でHTTPリクエストを送信でき、かつそのレスポンスをエディタ上で表示できるプラグインです。いままではREST APIのテストに別アプリを利用していたのですが、常に起動しているエディタ上で確認できるのは地味に便利です。
REST Client – Visual Studio Marketplace
4. Color Highlight
次に紹介するのが、「Color Highlight」というプラグインです。
このプラグインは、HTMLやCSS等で指定されたカラーコードの箇所に色をつけて可視化してくれるプラグインです。ディレクターがHTMLの確認をする際に、デザインで指定されているカラーコードと整合性が取れているかどうかを確認する際に便利なプラグインです。
Color Highlight – Visual Studio Marketplace
5. Bracket Pair Colorizer
最後に紹介するのが、「Bracket Pair Colorizer」というプラグイン。
このプラグインは、ソースコードやドキュメント上に記載された括弧をペアごとに異なる色で表示してくれるプラグインです。中括弧や大括弧など対応している括弧ごとに色が変わるので、入れ子構造になっている場合でもどの括弧と紐付いているのかを簡単に判別することができます。
Bracket Pair Colorizer – Visual Studio Marketplace
おわりに
本日は「WebディレクターにおすすめするVisual Studio Codeのプラグイン」についてお話しました。便利なプラグインを活用して、業務効率化ができるのって素晴らしいですね！
LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。
