開発生産性を上げるために最低限入れておきたいVSCode拡張機能
はじめに
個人的に最低限入れておきたいVSCodeの拡張機能をご紹介しようしようと思います！
アイコンやテーマを変更する拡張機能などは省き、開発生産性を向上させ、プログラミング言語やフレームワークにかかわらず入れておきたい拡張機能のみをリストアップしていこうと思います！
GitLens
GitLensはVSCode内でGitの操作を容易にしてくれる拡張機能になります。
私はBlameを参照するときによく使用しています。
下記のように該当する箇所にカーソルをフォーカスするとその行の変更コミット情報を表示してくれます。
この行の変更はだれが変更したのかということを知りたいときに使えます。
Git Graph
Git GraphはそのリポジトリのGit Treeを見やすくするための拡張機能になります。
VSCode内のSource Treeの下記の場所をクリックすると閲覧することができます。
ブランチの構成であったり、この行のマージはどのブランチからマージのされたのかなどを確認をする際に役に立ちます。
ブランチ運用が正しくなされているかなどを確認する際にも役に立ちます。
Error Lens
Error Lensはbuildコマンドを実行したり、lintコマンドを実行したときにわかるようなエラーをコマンド実行前にエディター上で変更されたタイミングでエラーとなっている行の横にエラー内容を表示してくれる拡張機能になります。
エラーとなりうるコマンドを実行する前にインタラクティブにエラー内容をエディター上に表示してくれるのでかなり開発生産性を向上してくれる拡張機能になります。
GitHub Pull Requests
GitHub Pull Requestsは拡張機能の名前の通りGitHubのPull Requestに関することを便利にしてくれるGitHub純正の拡張機能になります。
Pull Requestに関する様々なことができるので多くの機能があります。
- VSCode上でのPRの作成
- 自分が作成したPRの一覧の閲覧
- 閲覧したいPRの該当のブランチへのチェックアウト
- VSCode上でのコードレビュー
私はレビューの確認をGitHub上では確認せず、ローカル上で確認をするように心がけているので、
レビュー指摘をもらった際に、そのPRのブランチへのチェックアウトをGUI上で行うために使用したり、
エディター上でレビュー指摘のコメントをエディター上で確認できるようになっているので、これらの機能を使用する際に重宝しています。
私自身がレビューする際もエディター上で確認してレビューするように心がけているので、VSCode上で変更箇所の確認をした後、わざわざGitHubの画面に移動しなくても、VSCode上でそのままレビューコメントをかけるので、レビュー時にも役立っています。
GitHub Copilot & GitHub Copilot Chat
こちらは多くの方が知っているであろうAIを使った開発支援を行うGitHub Copilotになります。
月額で$10かかってしまいますが、かなり重宝しています。
個人的にはCitHub Copilot Chatをよく使っています。
エラーになってしまっているが、よくその原因がわからないときには「Explain Using Copilot」をクリックするとそのエラー内容に関して、Chat上で説明をしてくれます。
初歩的なミスであれば、Copilotだと一瞬で解答してくれるので、少し前まではとりあえずGoogleで検索をかけていましたが、最近ではとりあえずCopilotに質問するようになっています。
Bookmarks
Bookmarksはブックマークしておきたい行をブックマークしておいてあとからその個所に簡単に戻ることができるようにする拡張機能になります。
一時的に別のタスクを実施しなければならないが、今見ている箇所の場所を忘れたくないときや
別の関数を参照しないといけないが、後々にこの行へ戻ってくることが想定されるなどでよく使用しています。
おわりに
今回はプログラミング言語、フレームワークに依存しない拡張機能をご紹介しました！
他にもvscode-iconsやGitHub Themeなどのデザイン面を変更するような拡張機能もありますが、今回はどんな人でも入れておけば損しない拡張機能のみをご紹介させていただきました！
今回は拡張機能のリストアップをするような記事になりましたが、もう少し拡張機能をふかぼった記事を出してみてもいいかもなと思っています。
Discussion