Movatterモバイル変換


[0]ホーム

URL:


NRIネットコム社員が様々な視点で、日々の気づきやナレッジを発信するメディアです

注目のタグ
    トップ>テクノロジー>Visual Studio Codeを使ってDockerコンテナ内でシステム開発を行う

    Visual Studio Codeを使ってDockerコンテナ内でシステム開発を行う

    本記事はNRIネットコム Advent Calendar 202224日目の記事です。
    🎁 23日目▶▶Happy Christmas Eve! ▶▶25日目 🎄

    はじめまして、入社7年目の川畑です。主にPHPを使ったWebアプリの開発・保守・運用を担当しております。

    今日はクリスマスイブですね。私は枕元に現ナマが置かれる予定です。夢はないけど嬉しい。

    はじめに

    ローカルに開発環境を構築する際にDockerを利用されている方も多いですよね。作って壊してが楽、ローカルにプログラミング言語を入れなくても開発環境が構築できるなどメリットにあふれています。そんなDockerを利用して環境を構築!人気エディタVisual Studio Code(以下、VS Code)でいざソースコードを書くぞ!と勇むと、下記のようなメッセージが通知されます。(PHP環境だとお考え下さい)

    Cannot validate since a PHP installation could not be found. Use the setting 'php.validate.executablePath' to configure the PHP executable.

    ローカルにPHPがないからコード補完とかできないよ、といった内容です。このようにローカル側に言語やライブラリがないと動かない拡張機能がちらほらあるため、このままだと快適な開発が行えません。せっかくDockerを使っているのに拡張機能のためにローカルにプログラミング言語やライブラリを入れるというのも気が進みませんよね。そんな時に役に立つ拡張機能をご紹介していきます。

    ※今回はVS Code拡張機能の紹介のため、DockerやVS Code自体の説明、導入方法は割愛します。

    拡張機能 Dev Containers

    今回導入するのはDev Containersという拡張機能です。

    Dev Containers - Visual Studio Marketplace

    VS CodeでDockerコンテナにリモート接続し、Dockerコンテナ内で開発を行える素敵な拡張機能です。公式サイトによると下記のような仕組み。コンテナに接続した際にVS Code Serverがインストールされることで、ローカルのVS Codeを介してコンテナ内でのシステム開発を可能にするとのこと。拡張機能などはVS Code Server側にインストールされるため、ローカル設定に依存されずコンテナごとに管理できるようです。

    リモート接続構成

    引用元:https://code.visualstudio.com/docs/devcontainers/containers

    使ってみる

    1. VS CodeにDev Containersをインストールしておきます。

    2. 開発環境を準備します。今回は簡易的に下記のリポジトリを利用させていただきます。

      GitHub - ucan-lab/docker-laravel

    3. docker compose up -dで各コンテナを起動します。

    4. VS Codeでサイドバーからリモートコンテナーを選択すると起動中のコンテナが確認できます。

    5. 接続したいコンテナ名を右クリックしてAttach to Containerをクリックします。

    6. ウィンドウが開きなおされ、画面左下にContainer <コンテナ名>が表示されていれば接続できていますので、フォルダを開くからソースコードの格納場所を指定して開きましょう。

    7. 見事コンテナに接続できました。ターミナルもコンテナに対して接続されているので、コンテナ内でコマンド実行する際にも毎回docker compose exec <コンテナ名> shと実行する必要がなくなります。

    8. さて、この設定で拡張機能が使えるかを試してみましょう。PHPをインストールしていないと使えない拡張機能として下記を入れてみます。

      PHP IntelliSense - Visual Studio Marketplace

      拡張機能をインストール後phpファイルで適当に入力してみるとコード補完をしてくれるようになりました。

    おわりに

    ネット上によく転がっている内容ではありますが、備忘もかねて簡単な使用例をご紹介させていただきました。下記気になる点もありますので、また使用感が分かったら記事を書きたいと思います。

    • 拡張機能の管理

      コンテナ接続時とリモートでは拡張機能が共有されませんので、接続先のコンテナごとにミニマムな拡張機能構成でVS Codeを使うことができます。またdevcontainer.jsonという設定ファイルで拡張機能の自動インストールも管理できるようなのでチーム開発にも向いていそうです。

    • Docker代替ツールへの拡張性

      裏取りができているわけではないですが、Podmanでもdev containerでコンテナ接続が出来そうです。Docker Desktop離れを考えると他のツールで使えることも重要ですね。

    関連記事
    執筆メンバー

    NRIネットコムからのお知らせ

    【ウェビナーのお知らせ】12/18(木)開催「MSPで実現する運用再編のアプローチ~バラバラな運用がクラウド活用を阻害する~NRIネットコム AWS請求代行サービスの新プラン~コスト削減・セキュリティ強化・サポート充実の複数の選べるプラン展開~NRIネットコム実績紹介 中国新聞社様に聞く~AWSによるIxAプログラムで、生成AIを活用した新サービスを企画した2日間とは?NRIネットコム採用情報 キャリア採用NRIネットコム 公式Instagram

    NRIネットコムの公式アカウント

    Xinstagram

    NRIネットコムについて

    NRIネットコムのコーポレートサイトクラウドの活用なら NRIネットコムのクラウドソリューションサービス

    引用をストックしました

    引用するにはまずログインしてください

    引用をストックできませんでした。再度お試しください

    限定公開記事のため引用できません。

    読者です読者をやめる読者になる読者になる

    [8]ページ先頭

    ©2009-2025 Movatter.jp