1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

VSCode のちょっとした拡張機能

Last updated at Posted at 2022-05-06

はじめに

この記事は気楽に読んでいただけたら嬉しいです。

どんな人が見る記事なの?

  • VSCodeを日々使っている方
  • これからVSCodeを使用して作業に取り掛かりたい方

上記の方には楽しんで見てもらえると思います。
また使用したことがない方にはVSCodeを使用してみたいと少しでも思っていただけたらと思います。

前半は面白い拡張機能、
後半は実際に普段使いで使用できる実践的な拡張機能を紹介していきます。
(今回は拡張機能の細かい詳細や設定などは省きます)

そして紹介した拡張機能に興味を持っていただけたらインストールして使用してみてください。

それではいきましょう!

ちょっとした拡張機能

Power Mode

スクリーンショット 2022-04-13 15.42.05.png
Power Mode

こちらは知ってる人も多いと思います。
Power Modeはタイピングをする度に設定したエフェクトがかかる拡張機能です。
そして右上にコンボが加算されます。
ezgif.com-gif-maker.gif

主なエフェクト

  • paraticles (爆発)
  • fireworks (花火)
  • flames (炎)
  • magic (魔法?)
  • clippy (クリップ?)
  • simple-rift (控えめ)
  • exploding-rift (大爆発)

常にPower Modeを設定していると鬱陶しいのでテンションを上げたいとき等に設定してください。
(自分は未設定です。)
設定の仕方はPower Modeの設定にチェックをするだけです。


vscode-pets

スクリーンショット 2022-04-13 16.22.01.png
vscode-pets

vscode-petsはVSCode内でペットを飼うことができる拡張機能です。
「何言ってるの」という方も多いと思いますので下の動画を見てください。

ezgif.com-gif-maker (1).gif

カーソルクリックに合わせて猫が反応してくれます。
他にもたくさんのペットがいますのでご自身の好きなペットを配置してあげてください。
(トトロなども)


vscode-live2d

スクリーンショット 2022-04-13 16.52.00.png
vscode-live2d

こちらはVSCode内にキャラクターを召喚する拡張機能です。

※インストールするとVSCodeのサポート対象外になります。
※インストールの際は自己責任でお願いします。

カーソルに合わせて顔や、目線を動かしてくれます。
実際に自身のPCでインストールした動作が下記になります。
ezgif.com-gif-maker (2).gif

動作確認で登場する女の子はデフォルトで設定されています。
他にもたくさんのキャラクターに設定することができるので試してみてください。


実際に普段から使用できる拡張機能

現在VSCodeの拡張機能を紹介している記事はたくさんあり、自分もその記事を読みインストールした拡張機能がたくさんあります。
その中で特に自分が良いと思った拡張機能をざっくりと紹介します。

Git History

スクリーンショット 2022-04-13 17.43.15.png
Git History

開発で欠かせないGitでのバージョン管理をVSCode内で、コミット履歴等を確認することができる拡張機能になります。
実際活用するケースは非常に多いです。


Trailing Spaces

スクリーンショット 2022-04-13 20.13.19.png
Trailing Spaces

Trailing Spacesは行の末尾にスペースが入っていると赤く表示してくれます。
余計な空白を示してくれるのですぐに気づくことができます。


indent-rainbow

スクリーンショット 2022-04-13 20.16.21.png
indent-rainbow

indent-rainbowは行前の空白がどれだけ空いているか色別で表示してくれます。
この色がバラバラで自分的には見やすいのですが、統一したい!という方は色を統一することもできるので設定してみてください。


Bracket Pair Colorizer

スクリーンショット 2022-04-13 20.19.21.png
Bracket Pair Colorizer

Bracket Pair Colorizerは括弧がどれだけ続いているのか色と線で表示してくれます。
そのため括弧がどこまで続いているのか一目見ただけでわかるのでとても助かっています。


まとめ

いかがでしたでしょうか。
面白い拡張機能は開発効率が上がるとは言えませんが息抜きに入れてみるのも良いと思います。
実際に自分も入れてみて息抜きしたこともあります...

実際に普段から使用できる拡張機能は本当に便利で重宝しています。
他にもまだまだたくさんの便利な拡張機能があります。(今回紹介していない拡張機能も)
自分もまだ知らなく開発効率を上げたり息抜きできる拡張機能に今後出会うかもしれません。
そんな拡張機能に出会えた日にはまた記事を書くかも...書いていいのか。
もしくは「こんな拡張機能があったら良いのにな」と思っている方はご自身で作ってみるのも良いかもしれませんね。

また、VSCodeを使用していない方、使用経験が浅い方が少しでもVSCodeを使用したいと思っていただけたら幸いです。

そして是非弊社で一緒に働いていただける方を募集しております。
下記URLを見ていただいて少しでも興味を持っていただけたら応募してください。
株式会社運動通信社

1
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?