1
/
5
Wantedly
About 株式会社ランドネット
株式会社ランドネット
https://landnet.co.jp

東京都

【Tech Blog】2021年に絶対入れたい！VSCodeの拡張機能.md

Arisa Niitsuma
Arisa Niitsuma
人事部採用課
on 2021-04-22

こんにちは。ランドネット採用広報です。
今回は【Tech Blog】2021年に絶対入れたい！VSCodeの拡張機能.md
ということで、ランドネット期待の若手エンジニアが書いてくれました。


「開発環境にVSCode使っていて、拡張機能が沢山あるけどどれが良いの？」という方のために、今回は私が「これがオススメ！」という拡張機能をご紹介します！！

Bracket Pair Colorizer 2

Bracket Pair Colorizer 2 - Visual Studio Marketplace
This extension allows matching brackets to be identified with colours. The user can define which tokens to match, and which colours to use. Screenshot: Differences between v1 and v2? v2 Uses the same bracket parsing engine as VSCode, greatly increasing sp
https://marketplace.visualstudio.com/items?itemName=CoenraadS.bracket-pair-colorizer-2
出所：Visual Studio Marketplace



これを使うと、一致するブラケットを色で識別してくれるの！
沢山ブラケットがあっても一目でわかるから便利！

Remote Containers

Remote - Containers - Visual Studio Marketplace
The Remote - Containers extension lets you use a Docker container as a full-featured development environment. Whether you deploy to containers or not, containers make a great development environment because you can: Develop with a consistent, easily repro
https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-containers
出所：Visual Studio Marketplace

Remote Containersは、Dockerコンテナをフルに開発環境として使えます！
新しいチームメンバーが入った時にも簡単に立ち上げて実行できるようになるからめっちゃ良い！

Import Cost

Import Cost - Visual Studio Marketplace
Extension for Visual Studio Code - Display import/require package size in the editor
https://marketplace.visualstudio.com/items?itemName=wix.vscode-import-cost
出所：Visual Studio Marketplace

Import Costは、JavaScriptとかでインポートしたときのパッケージの推定サイズ数を教えてくれるの！
重すぎる時は赤色で警告を出してくれるから必須！

Live Share

Live Share Extension Pack - Visual Studio Marketplace
If you're not already familiar with Visual Studio Live Share, refer here for more information. This extension pack includes everything you need to start collaboratively editing and debugging in real time, including integrated audio and text chat.
https://marketplace.visualstudio.com/items?itemName=MS-vsliveshare.vsliveshare-pack
出所：Visual Studio Marketplace

Live Shareは、プロジェクトの仲間と共同編集とか共同デバッグができるの！
音声通話だったりチャットとかもできるから、ペアプロとかもできるね！

Quokka.js

Quokka.js - Visual Studio Marketplace
Extension for Visual Studio Code - JavaScript and TypeScript playground in your editor.
https://marketplace.visualstudio.com/items?itemName=WallabyJs.quokka-vscode
出所：Visual Studio Marketplace

Quokka.jsは、JavaScript/TypeScriptの開発者の生産性を格段にあげてくれる！
ランタイム値が更新されて横に表示してくるの

Better Comments

Better Comments - Visual Studio Marketplace
The Better Comments extension will help you create more human-friendly comments in your code. With this extension, you will be able to categorise your annotations into: Alerts Queries TODOs Highlights Commented out code can also be styled to make it clear
https://marketplace.visualstudio.com/items?itemName=aaron-bond.better-comments
出所：Visual Studio Marketplace


Better Commentsは、わかりやすいコメントを書くときには必須！！！
こんな感じで使いわけがあって他の人がみても分かりやすいよね！

Settings Sync

Settings Sync - Visual Studio Marketplace
While being free and open source, if you find it useful, please consider supporting it by donating via PayPal or Open Collective. If you are using it in office as a team, please ask your company to support us via Open Collective from just 2$ per month!
https://marketplace.visualstudio.com/items?itemName=Shan.code-settings-sync
出所：Visual Studio Marketplace

Settings SyncはGitHub Gistを使って、設定とかワークスペースとかをコンピュータ間で同期できるの！
チームで設定を共有したい！って時にもいい！

Remote — SSH

Remote - SSH - Visual Studio Marketplace
The Remote - SSH extension lets you use any remote machine with a SSH server as your development environment. This can greatly simplify development and troubleshooting in a wide variety of situations. You can: Develop on the same operating system you depl
https://marketplace.visualstudio.com/items?itemName=ms-vscode-remote.remote-ssh
出所：Visual Studio Marketplace

これは、リモートマシンで開発とかリモートマシンのファイルをVSCodeで編集ができたりするの。
例えば、ec2の環境で本番環境とOSを同じにして開発できたり、複数のマシンから同じ開発環境にアクセスできたりね！
もちろんec2じゃなくてもssh接続できれば、他でも大丈夫！

Prettier

Prettier - Code formatter - Visual Studio Marketplace
Extension for Visual Studio Code - Code formatter using prettier
https://marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscode
出所：Visual Studio Marketplace

Prettierは、コードを解析してコードをフォーマットしてくれるの！
だからコードの一貫性が保たれるからコードがとっても綺麗になるよ！


今回ご紹介したVSCodeは、全部めっちゃ良いので是非全部使ってみて下さい！

株式会社ランドネット's job postings
開発 エンジニア テックブログ 拡張機能 VSCode
1 Likes
1 Likes

株式会社ランドネット

当社は、日本の不動産を「流通・再生・運用」する不動産流通会社です。 中古マンションをメインとした全国各地の物件を取り扱っております。 『不動産×テクノロジー』の理念を基に、デジタル化が後進的と言われる不動産業界においても、当社は早い段階で不動産とシステムの融合を果たし、他社にはないビジネスモデルを強みとして、事業拡大をして参りました。 これからの不動産ビジネスは、経験値だけではなく精度・鮮度ともに高いデータこそカギを握る。 そんな信念のもと、システムを内製化し独自のIT「不動産流通データベースシステム」を 構築・運用しながら、先進的な取り組みを行い、常に複数のプロジェクトが平行して動いており、 現在、約80名の組織で開発を行っています。 多岐にわたる実績と広範なネットワークから収集する情報・専門知識を駆使し、不動産運用における様々なシーンでサービスをご提供しています。

エンジニア

Weekly ranking

Show other rankings
Like Arisa Niitsuma's Story
Let Arisa Niitsuma's company know you're interested in their content