実践VSCodeリモートSSH・コンテナ開発機能

 実践VSCodeリモートSSH・コンテナ開発機能

Fc815be82d09a2e922d4000b65b9f83b?s=128

74th(Atsushi Morimoto)

January 23, 2020
Tweet

Transcript

  1. 実践 リモートSSH・コンテナ開発機能 Atsushi Morimoto @74th

  2. Atsushi Morimoto @74th Python、Go、Kubernetes、Terraform @ VSCode with RemoteDev 仕事の開発の95%をリモート開発機能を使う(残り5%はAndroid) 様々な言語、環境のデバッグ設定集

    https://github.com/74th/vscode-debug-specs
  3. 2月20日発売予定 400ページで、ほぼ全機能解説 TypeScript/Go/Pythonでの          実践的な開発実例 拡張機能開発 (コマンド、タスク、テーマ…) LSP解説  → LSPを使った拡張機能開発まで ※表紙は作成中のもので、変わることがあります

  4. Contents 1. リモート開発機能でどう世界が変わったか 2. @74thの環境と、リモートSSH機能デモ 3. リモートSSHの制約 4. WSL 5.

    リモートコンテナ機能とは 6. リモートコンテナ機能デモ 7. WSL、リモートSSHでリモートコンテナ機能を使う
  5. 近年のよくある開発環境

  6. 近年のよくある開発環境

  7. リモート開発機能とは…

  8. リモート開発機能の何が嬉しいか? A: 使い慣れたPC(MacOS、Windows)を使いながら、 Linuxの世界で開発ができる ◦ 最終成果物のLinuxコンテナで動けばOK! ◦ MacOS、Windowsでの環境構築不要! ◦ Linuxの解析ツールがすべて使える(systemtap、strace……)

  9. @74th の環境 Host : MacOS+Parallels Desktop 15 • Apple Hypervisor

    Frameworkに対応 • 比較した中で、IO性能が高かった VM: Ubuntu Server 19.10 • Homebrew がLinuxでも使える App: GoのWebアプリ • ~/go/src/github.com/74th/vscode-book-golang • TODO 管理アプリ MacBookPro
  10. リモートSSH機能デモ • SSHログイン ◦ ~/.ssh/config/ ◦ Goの補完が効く様子 • デバッグ実行とポートフォワーディング

  11. リモートSSH機能の制約 • Linuxサーバを構築していること(Windowsサーバは準備中)。 • x86_64 or aarch64 アーキテクチャであること。 • SSHで接続可能であること。~/.ssh/config

    に設定があること。 • Linuxサーバ内で、プロジェクトファイルがチェックアウトされていること。 • Linuxサーバに、ビルドに必要なツールのほか、git、curlなども含めて、 開発に必要なソフトウェアがインストールされていること。 • Linuxサーバでリポジトリにアクセスできること。
  12. ARM64 (Raspberry Pi 4) aarrch64(ARM64)に対応 拡張機能やLanguageServerが 対応していない場合もある

  13. ARM64 (Raspberry Pi 4) aarrch64(ARM64)に対応 拡張機能やLanguageServerが 対応していない場合もある

  14. WSL(Windows Subsystem for Linux) • 仮想マシンと異なり、 メモリ、CPU、ストレージの リソースはホストマシンと共有 • WSL

    2からdockerも使える • $ code . で起動 • localhost を共有
  15. リモートコンテナ機能での開発

  16. Dockerfile • 本番環境のDockerfileとは別に作る • git、procpsを追加 • 本番環境と開発用のツールを 両方ともインストール • 変更したら

    コマンド「Rebuild Container」 <Dockerfileの参考> https://github.com/Microsoft/vscode-remote-try-node try-{python,go,java,dotnetcore,php,rust,cpp} FROM python:3.7 RUN apt-get update && \ apt-get -y install git procps WORKDIR /app ADD ./requirements.txt ./ RUN pip install -r requirements.txt ADD ./dev-requirements.txt ./ RUN pip install -r dev-requirements.txt
  17. .devcontainer/devcontainer.json • Dockerfile .devcontainer/からの相対パス • 拡張機能 • 開放ポート • 変更したら

    コマンド「Rebuild Container」 { "name": "Python 3.7", "context": "..", "dockerFile": "Dockerfile", "appPort": [8080], "extensions": [ "ms-python.python" ] }
  18. リモートコンテナ機能デモ • Reopen in Container

  19. WSLのDockerを使いたい 昨日の Docker Desktopの アップデートで対応 ※Experimental

  20. None
  21. SSH先のDockerを使いたい 要するに DockerAPI にアクセスして、リポジトリをマウントする ◦ TCPでDockerにアクセス可能にする /etc/default/docker -> DOCKER_OPT=DOCKER_OPTS="-H 0.0.0.0:9000”

    export DOCKER_HOST=tcp://remote:9000 ◦ WSL、SSH先でリポジトリをチェックアウトして、 そのディレクトリをマウントする docker-compose.yamlを作る ◦ docker-composeでコンテナを起動する ◦ コマンド「Attach to Running Container」→ コマンド「Open Folder...」でマウントしたディレクトリを開く • https://qiita.com/74th/items/06b91cf4fecfc61bfbf4
  22. docker-compose.yaml https://qiita.com/74th/items/06b 91cf4fecfc61bfbf4 version: "3" services: python: build: context: .

    dockerfile: ./Dockerfile ports: - 8080:8080 user: "1000:1000" # マウント先のユーザ environment: HOME: "/home/nnyn/" # .vscode-serverディレクトリに使われ る command: /bin/sh -c "while sleep 10000; do :; done" # コンテナを起動するだけで何もしない volumes: - /home/nnyn/vscode-book-python:/app # リポジトリマウント - /home/nnyn/.git:/home/nnyn/.git # gitの設定 - /home/nnyn/.netrc:/home/nnyn/.netrc # gitの認証情報 - /home/nnyn/.vscode-container:/home/nnyn/.vscode-server # 拡張機能を共有 SSH先の Dockerを使いたい
  23. リモート開発機能の もう少し詳しい内容は… 技術書典7 BOOTHで販売中 https://74th.booth.pm/items/1575560