「Dockerってよく聞くけど、なんだか難しそう…」
「VS CodeでDockerを使うと何が便利なの？」
そんな方にこそ試してみてほしいのが、VS Code × Dockerのコンテナ開発環境です💡
Dockerは、アプリ開発に必要な環境をまるごと“箱（コンテナ）”の中に閉じ込めて使えるツール。
VS Codeと組み合わせることで、複雑な開発環境を簡単に再現・共有・管理できるようになります。
この記事では、
- Dockerの基本的な仕組みとメリット
- Windows・MacそれぞれでのDocker Desktopの導入手順
- VS Codeとの連携方法（拡張機能＆Dev Containers対応）
を、初心者でも迷わず進められるように図解レベルで丁寧に解説していきます😊
✔「環境構築に時間をかけたくない」
✔「チーム全員が同じ環境で開発したい」
✔「開発環境を汚さず、きれいに保ちたい」
そんな方にぴったりの内容です！
モダンな開発スタイル「コンテナ開発」への第一歩として、ぜひこの記事を活用してください！
Dockerを使う準備（Windows / Mac共通）
Dockerを使うには、まず「Docker Desktop」というソフトをインストールする必要があります。
これは、PC上でDockerを動かすためのツールで、WindowsでもMacでも無料で利用可能です。
Docker Desktopとは？
Docker Desktopは、以下のようなことを簡単に行える公式のDocker管理ツールです👇
- コンテナの作成・起動・削除
- イメージの管理
- コンテナのログ確認
- システムリソースの管理（メモリ・CPUなど）
VS Codeとの連携もスムーズで、Docker初心者には欠かせない存在です✨
インストール前の確認ポイント（共通）
Docker Desktopをインストールする前に、以下の点を確認しておきましょう👇
✅ 1. 仮想化が有効になっているか？
- Windowsでは「仮想化支援機能（VT-x）」、
- MacではApple SiliconまたはIntel対応
BIOSやシステム設定から仮想化が有効になっていないと、Dockerは起動できません⚠️
✅ 2. システム要件を満たしているか？
- Windows 10（ProまたはEnterprise、2004以降）
- Mac（macOS 11以降推奨）
- メモリ8GB以上推奨
※ WSL2（Windows Subsystem for Linux 2）のインストールも必要になるため、Windowsユーザーは注意！
✅ 3. ネット接続が安定しているか
Docker Desktopのインストーラーや、コンテナ用の各種イメージはインターネット経由で取得します。
不安定なWi-Fi環境だと、途中で止まることがあるので要注意⚡
WindowsでのDocker Desktop導入手順
1. Docker公式サイトからインストーラーをダウンロード
まずは以下のリンクから、Docker DesktopのWindows版をダウンロードします👇
🔗 https://www.docker.com/products/docker-desktop/
※自分のWindowsが「Pro」か「Home」かを事前に確認しておくとスムーズです。
2. インストーラーを実行してセットアップ開始
- ダウンロードした
.exeファイルをダブルクリック - 「WSL2 を使用する」オプションが表示されたら、チェックを入れてインストールを続行
※ WSL2（Windows Subsystem for Linux 2）がインストールされていない場合は、Docker Desktopが自動で案内してくれます。
3. インストール完了後、PCを再起動
インストールが完了したら、再起動を求められる場合があります。
素直に再起動しましょう😊
4. Docker Desktopを起動＆初期設定
再起動後、「Docker Desktop」を起動すると、次のような画面が表示されます👇
- ライセンスへの同意（Acceptを選択）
- チュートリアルをスキップ or 実行
- Dockerのステータスが「Running」になればOK！
5. 動作確認（コマンドでチェック）
以下のコマンドを PowerShell または Windows Terminal で実行して、動作を確認しましょう👇
docker --version→ Docker version xx.xx.xx と表示されれば成功です✨
MacでのDocker Desktop導入手順
1. Docker公式サイトからインストーラーをダウンロード
まずはDocker公式サイトにアクセスし、Mac用のDocker Desktopをダウンロードします👇
🔗 https://www.docker.com/products/docker-desktop/
※Apple Silicon（M1/M2/M3）かIntelかで、インストーラーが異なります。
ダウンロードページで自動的に適したバージョンが選ばれますが、手動で選ぶことも可能です。
2. ダウンロードした .dmg ファイルを開く
- ダウンロードしたインストーラーをダブルクリック
- 表示されたウィンドウで、Dockerアイコンを「Applications」フォルダにドラッグ
3. Docker Desktopを起動して初期設定
「アプリケーション」フォルダからDockerを起動すると、初回のみいくつかの設定確認が入ります👇
- Macのパスワード入力（システム変更許可）
- 権限の付与（ネットワーク設定など）
- ライセンス同意（「Accept」をクリック）
4. ステータスバーで起動確認
起動後、画面上部のメニューバーにクジラのアイコンが表示されていればOK！
アイコンをクリックし、「Docker Desktop is running」と表示されていれば起動成功です✨
5. ターミナルで動作確認
次に、Macのターミナルを開いて以下のコマンドを実行👇
docker --version→ Docker version xx.xx.xx が表示されれば、インストールは完了です！
VS Codeとの連携方法
Dockerをインストールしたら、VS Code上でもDockerを簡単に操作できるように設定しましょう。
ここでは、2つの連携方法をご紹介します👇
1. Docker拡張機能をインストールする
VS Codeには、公式の「Docker」拡張機能があります。
これを入れるだけで、以下のような操作がGUIでできるようになります✨
✅ できること
- コンテナ・イメージ・ボリュームの一覧表示
- コンテナの起動・停止・削除
- Dockerfileのビルド＆実行
- コンテナの中身にアクセス（シェル接続）
🔹 インストール手順
- VS Codeを起動
- サイドバーの拡張機能マーク（四角アイコン）をクリック
- 検索バーに「Docker」と入力
- Microsoft製の「Docker」拡張機能を選択し、インストール
→ インストールが完了すると、左のサイドバーにクジラマークのアイコンが表示されます！
2. Dev Containers（旧 Remote – Containers）を活用する
Dockerを使って、開発環境ごとまるっとコンテナで管理したい場合は、
「Dev Containers」拡張機能を使うのがおすすめです！
✅ できること
- プロジェクトごとに開発環境を定義・共有できる
- VS Codeでコンテナを起動し、その中でコーディングできる
.devcontainerフォルダで環境構成をバージョン管理できる
🔹 インストール手順
- 拡張機能で「Dev Containers」と検索してインストール
- プロジェクトに
.devcontainerフォルダを作成 devcontainer.jsonと必要に応じてDockerfileを追加- コマンドパレットから「Reopen in Container」を実行
よくあるトラブルと対策
Dockerは非常に便利なツールですが、初期設定の段階でつまずくケースも少なくありません。
ここでは、初心者の方が遭遇しやすいトラブルと、その解決策をまとめました！
1. Dockerが起動しない／すぐ終了する
🛠 よくある原因
- 仮想化が無効になっている（BIOSで無効）
- WSL2がインストールされていない（Windowsの場合）
- 古いOSや非対応のCPUを使用している
✅ 対策
- BIOS設定で「仮想化支援（Intel VT / AMD-V）」を有効化
- Windowsなら、Microsoft公式からWSL2をインストール
- Docker公式のシステム要件を確認
2. コンテナが表示されない／接続できない
🛠 よくある原因
- Docker Desktopは起動しているが、コンテナが動作していない
docker-composeファイルやDockerfileにミスがある
✅ 対策
- Docker拡張のクジラアイコンをクリックして状態を確認
- ターミナルで
docker psを実行し、稼働中のコンテナがあるか確認 docker-compose upやdocker buildの出力ログをチェックしてエラーを確認
3. 「Reopen in Container」で開かない／エラーが出る
🛠 よくある原因
.devcontainerフォルダの設定ミス- Dockerが停止中／イメージが存在しない
- コンテナのビルドエラー
✅ 対策
devcontainer.jsonの記述ミス（特にカンマ忘れなど）を見直す- Docker Desktopを再起動する
- サイドバーの「Docker」からログを確認
4. 「Dockerコマンドが見つかりません」と表示される
🛠 よくある原因
- Docker Desktopのインストールが不完全
- システムの
PATHにDockerのパスが通っていない
✅ 対策
- 一度Dockerをアンインストール→再インストールしてみる
- ターミナルで以下を入力し、インストールパスを確認 bashコピーする編集する
which docker
📌 トラブルが起きたときは、Docker DesktopのログやVS Codeの出力タブも積極的に活用しましょう！
まとめ
この記事では、VS CodeとDockerを連携させて、コンテナ開発環境を構築する方法を初心者向けにわかりやすく解説しました！
✔ 振り返りポイント
- Dockerとは？
→ アプリに必要な環境をまとめて動かせる「コンテナ技術」 - VS CodeとDockerの組み合わせメリット
→ ローカルを汚さず開発できる／チームで環境共有できる／GUIで簡単に操作できる - Docker Desktopの導入方法（Windows/Mac対応）
→ 公式サイトからDLし、OSに合わせて設定を進めればOK - VS CodeでのDocker活用方法
→ Docker拡張機能／Dev Containersを使えば、VS Code内で快適に開発できる！ - よくあるトラブルとその解決策も紹介
→ 初期設定・ビルドエラー・接続不良などの対処法を事前に知っておけば安心
🚀 結論：Dockerを導入すれば、VS Codeはもっとパワフルな開発ツールになる！
環境構築にかける時間を減らし、どこでも同じ開発ができるようになるので、
「これから本格的に開発を始めたい」という方には特におすすめです😊
💡 関連するVS Codeの記事はこちらもどうぞ！
👉 VS Code関連記事一覧
📩 開発環境の構築サポートやコーディングのご依頼も受付中！
👉 ご相談・お問い合わせはこちら
