このページで解説している内容は、以下の YouTube 動画の解説で見ることができます。

Docker超入門:VS Codeをインストールして日本語化&Docker環境を整える方法

VS Codeをインストールして日本語化&Docker環境を整える方法

 Dockerを快適に使うためには、コードエディタの準備も大切です。ここでは、無料で高機能なエディタ Visual Studio Code(通称:VS Code) をインストールし、日本語化してからDocker環境を整える流れを紹介します。手順はとてもシンプルなので、安心して進めてくださいね。

VS Codeとは?

 VS CodeはMicrosoftが開発した無料のオープンソースエディタで、テキストエディタでありながら統合開発環境(IDE)の機能も持っています。拡張機能を追加することで、あらゆる言語やフレームワークに対応できるのが魅力です。

項目説明
名称Visual Studio Code(略称:VS Code, Code)
特徴無料・オープンソースで、拡張機能が豊富
対応多数の言語・フレームワークに対応
利用者メリット高いカスタマイズ性で、自分好みの開発環境を作れる。

多くの開発者に支持される理由は「必要な機能を必要な分だけ追加できる自由さ」にあります。

VS Codeのダウンロード

まずは公式サイトからインストーラーをダウンロードしましょう。

1.VS Codeの公式ダウンロードページ にアクセス

URL:https://code.visualstudio.com/download

2.「↓Windows」をクリックしてインストーラーを取得

VS Codeのインストール

インストール手順は次の通りです。

1.ダウンロードした VSCodeUserSetup-x64-1.104.0.exe をダブルクリック

2.使用許諾契約書の同意

「同意する」を選び「次へ(N)」をクリック

3.インストール先の指定

デフォルトでOK、「次へ(N)」をクリック

4.スタートメニューフォルダーの指定

変更せず「次へ(N)」をクリック

5.追加のタスクの選択

必要に応じてチェックを入れて「次へ(N)」

6.インストール準備完了

「インストール(I)」をクリック

インストールが始まります。

7.Visual Studio Code セットアップウィザードの完了

「完了(F)」をクリックするとVS Codeが起動

8.インストールの完了

これでVS Code本体のインストールは完了です。

テーマの変更

 デフォルトのテーマは、以前、VSCodeをインストールしたときに設定したテーマになっています。好みの問題ですが、白をベースとした「ライト モダン テーマ」や、黒をベースとした「ダーク テーマ」に変更できます。好みのテーマを選択するとよいでしょう。

ライト モダン テーマ にしてみる

歯車のアイコン「管理」をクリックして、「Themes」を展開し、「Color Theme」を選択します。

「Light Modern」を選択します。

「ライト モダン テーマ」に切り替わります。

ダーク テーマにしてみる

歯車のアイコン「管理」をクリックして、「Themes」を展開し、「Color Theme」を選択します。

「Dark(Visual Studio) Visual Studio Dark」を選択します。

「ダーク テーマ」に切り替わります。

VS Codeの拡張機能とは?

VS Codeの魅力は拡張機能にあります。ちょっとした追加でエディタがグッと便利になります。

種類説明
言語サポート構文ハイライトや自動補完、デバッグを追加
テーマ拡張見た目をカスタマイズできる
ツール拡張Git連携やコード解析など便利な機能
ワークスペース拡張プロジェクトごとの特化機能や設定

自分の作業に合わせて自由に組み合わせられるのがポイントです。

日本語化パックのインストール

インストール直後のVS Codeは英語表記ですが、日本語化はとても簡単です。 

1.左サイドバーから「Extensions」(拡張機能)をクリック

2.②索窓に「japanese」と入力

3.「Japanese Language Pack for Visual Studio Code」 をクリック

4.「Install」をクリック

5.インストール完了後、「Change Language and Restart」を押して再起動

 再起動するとすべて日本語表記に切り替わります。これで初心者でも安心して使えるようになります。

Docker拡張機能のインストール

 次にDockerを扱うための拡張機能を導入します。これにより、VS Code内でDockerの操作や管理が直感的にできるようになります。

1.➀左下の「管理」アイコンをクリック

2.②検索窓に「docker」と入力

3.②「Docker拡張機能」 をクリック

4.「インストール」をクリック

5.➀左下の「管理」アイコンをクリック

6.②検索窓に「container」と入力

7.➂「Container Tools」をクリック

8.「Container Tools」も一緒にインストールされていることが分ります。

 この拡張機能をインストールすると、Dockerfileやcompose.yamlを編集するときに補完機能が効いたり、シンタックスエラーを早めに見つけてくれるので、開発効率がぐっと上がります。

まとめ

 ここまでの流れで、VS Codeをインストールし、日本語化し、Docker開発を支える拡張機能を導入できました。

  • 無料で高機能なVS Codeを導入
  • 日本語化パックで操作がわかりやすく
  • Docker拡張機能で効率的にコンテナ開発

 これでVS Codeを使ったDocker環境の準備は万全です。次からは実際にDockerfileを書いたり、compose.yamlを使ってサービスを立ち上げたりと、Docker開発をスムーズに始められますよ。