Dev Containers経由で構築したDockerコンテナに対するポート設定

Dev Containers経由で構築したDockerコンテナに対するポート設定

Dev Containersとは(簡単に)


VSCodeの拡張機能で、開発環境をDockerコンテナ上に構築することが可能です。
チーム開発において一貫した開発環境を提供しやすくなり、VSCodeの統合機能によりコンテナ内で直接開発作業を行うことができます。

Extension for Visual Studio Code – Open any folder or repository inside a Docker…
marketplace.visualstudio.com

Dev Containers経由で構築したNode.js環境を起動したが、ページ疎通できず…


  1. 1. Dev Containersを利用してNode.jsの開発環境を構築
    2. Next.jsのプロジェクトを作成
    3. “yarn dev”を実行
http://localhost:3000にアクセスしたところ、ページの疎通ができない状態でした。

ポート設定が不足していた


Dev Containersを利用する場合、コンテナ構成は”devcontainer.json”の設定ファイルに記述する必要があるとのこと。

“devcontainer.json”は全く触っておらず、ファイルを確認したところポート関連の記述がありませんでした。

そのため、”devcontainer.json”内に以下を記述したところ、無事に疎通確認ができました。

"forwardPorts": [3000]