【VSCode】Docker環境の開発で入れておくと良い拡張機能

sanagi
2025-02-13
2025-02-13

こんにちは、sanagiです。

普段、Docker環境で開発している方も多いかと思います。

Dockerって、コマンド等機能多くて使いこなすの少し難しいですよね。

今回は、Docker環境で開発する際におすすめの拡張機能を紹介しようと思います。

Docker

1つ目に紹介するのが「Docker」です。

名前が一緒で紛らわしいですが、そういう名前の拡張子です。

Microsoftの提供で、使っている方も多い拡張機能かなと思います。
Docker操作のほどんどをGUIで操作することができるようになるので、筆者のようにコマンド覚えるのが苦手な方には特におすすめしたい拡張機能です。

以下、機能面について簡単に紹介していきます。

①コンテナの起動等の操作

コンテナの起動も簡単です。

docker-compose.yamlかDockerfileを選択し右クリックすると以下のようにdocker関連の選択肢が出てきます。

「Compose Up」を選択すると、ターミナルで以下のコマンド(buildと起動のコマンド)が実行されたことが分かります。

②コンテナの状態確認

running状態になったことを確かめたいときは、Docker(クジラ🐋)マークのタブを開くと、こんな感じで表示されます。

その他コンテナの停止やログの確認等色々できるので、ぜひ試してみてください。

筆者は日常的には高度なDocker操作はほとんどやらないため、大体このGUI操作で事足りております。

Dev Containers

次に紹介するのが「Dev Containers」です。

これは、起動中のコンテナに接続して作業したい場合にすごく便利です。

これがなかったら、ローカル上でコンテナ内のコードを触るしかないので、インポートエラーがエディタ上で頻発してしまって困る!という状態になると思います。(コンテナ内にしかインストールしていないFWやライブラリ等あるため。)

イメージ的には、このコマンドを実行しているような感じです。

docker exec -it XXXXXX bash

 

機能紹介

以下の手順でコンテナ内に接続します。

①VSCode左下の><のマークを選択

②以下のセレクトがVSCode上部窓に出てくるので、「Attach to Running Container」を選択

③起動中のコンテナ一覧が出てくるので、接続したいコンテナを選択します。そしたら新しいVSCodeのウィンドウが立ち上がると思います。

④新しく起動したwindow上で「Open Folder」を選択します。そしたらフォルダ一覧が出てくるので開きたいフォルダを選択します。

⑤そしたら選択したフォルダが開き、コンテナ内のファイルも編集することができるようになりました。

もちろん、ターミナルもコンテナ上で操作できるようになっているので、docker execコマンドでコンテナに接続する必要もありません。

おわり

どうでしたか?

Dockerは非常に便利なツールだと思いますので、私もより理解を深めたいなと思います!