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

VSCode Meetup #2
https://vscode.connpass.com/event/160083/

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
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