【VSCode】Remote Developmentについて

※この記事は、Visual Studio Code Advent Calendar 2022の5日目の記事です。

私は、ずっとVSCodeを使ってて、VS Code Meetupでも何回か発表もさせていただきました。

その中で「Remote-Containerでnext.js 環境を作った話」をした際に「Remote Development」「Remote Containers」などがごちゃごちゃになっている方も多かったので(私もそうでした)、ここでそれをまとめた記事にしようと思いました。

まず「Remote Development」ですが、これは下記3つの拡張機能がセットになった拡張機能パッケージのことです。

下記3つの拡張機能のインストールをまとめてRemote Development1回のインストールで済ますことができます。(もちろん、機能なども単体で入れた場合と全く同じです)

たまにRemote DevelopmentとRemote Containersを混同しているブログなどを見かけますが(=私もそうだった)、先述の通りRemote Developmentはあくまで拡張機能パッケージであり、Remote Development自体は拡張機能ではありません。

昔はDev ContainersがRemote Containersという名前だったので、余計ややこしかったのもあるんでしょうね。

これはコンテナ環境での開発をサポートしてくれる拡張機能です。
ローカル環境からイメージビルド＆コンテナ作成を行ったり、実際にコンテナ内に入ってVSCodeで開発・テストなどを行うことができます。

これについてはちょうど前回のStreamWest-1629さんがVSCode Devcontainer 放浪記という内容で投稿されているので、詳しくはそちらを読むのがよいと思います。

これは名前の通りSSH接続を行う拡張機能です。
SSHを用いてリモートホストに接続したり、接続先のリモートホスト環境でVSCodeで開発・テストなどを行うことができます。

その他、設定ファイルに接続設定を残して、マウス操作だけで簡単にリモートホストに接続が行えたりします。

なお設定ファイルにOSのhostsファイルを使うこともできますが、その場合は管理者権限でVSCodeを開かないといけないので、個人的にはRemote SSH用の設定ファイルを作成することをお勧めします。(もちろんRemote SSHのGUI操作で作成可能)

これはWindows上のフォルダをWSLとして開くことができる拡張機能です。
WSLとして開く≒Linuxとして開けるということになるので、Linuxに慣れている人には使いやすい拡張機能です。

また、最近は実際のサーバーはLinux環境で動かすことが多いので、そういう意味でもより実際のサーバーに近い感覚で操作することができます。

以上、Remote Development(＆その拡張機能)について説明しました。

Remote ContainersがDev Containersに名前が変わったので、だいぶ区別がつきやすくなりましたが、もしこのあたりがごちゃごちゃになっている人がいたら、そういう人たちの理解の助けになれば、と思います。

それでは、今回はこの辺で。

echo("備忘録");