インストール不要でVSCodeが使える
GitHub Codespacesは、GitHubのSaaSとして利用できるwebサービスであり、ブラウザで起動したイメージもVSCodeそのものである。拡張機能やターミナルも全く同様に使えるので、例えばGitHub Copilotも問題なく利用できる(要契約)。
利用方法は、①全てGitHub Codespacesで行うやり方と、②VSCodeはローカル(端末側)にフロントエンドを置き、リモートのVSCode Serverをコンテナ内で実行できるため、同様にローカル:端末側は従前のVSCodeアプリを用いるやり方をそれぞれ説明する。
利用方法①:全てCodespacesを使用
GitHubのアカウントとネット接続可能なPCやiPadのみで利用できる(無償利用範囲)。GitHub上の任意のRepositoryを、GitHub Codespaces上にcloneする方法なのでブラウザだけで完了する。
利用方法
- GitHubサイトに接続、開発対象のリモートリポジトリを開く
- 「Code」の左にある下矢印をクリック
- タブの「Codespaces」を選択し、「Create Codespace on ****」をクリック
すると見事なぐらいVS Codeと同機能な画面が開くので、VSCode同様に利用できる。
- HTTPS接続なのでファイアウォールの内側から利用可能
- ローカル(端末側)への開発ツール類のインストール不要(Dockerも不要)
- ポート転送機能を用いたWebアプリ開発が可能
- 開発環境のトラブル時はコンテナ抹消&再構築で解決
- GitHub Codespaces上でDockerが利用可能(Docker-in-Docker)
- 開発者の増減対応も容易(サービス利用の増減のみ)
利用方法②:ローカル:VSCode+リモート:Codespaces
ローカル:端末側はVSCodeアプリを用いて、リモートサーバーのGitHub Codespacesと接続する利用方法も可能である。従前からVSCodeが有しているVSCode Serverのコンテナの一つとしてGitHub Codespacesを使用する。
利用方法:
公式が詳しい:
- ローカル側にVSCodeエディタ(+環境)、リモート側に対象ソースコードやプロセスを配置
- 画面情報を転送しないので軽快に動作する(リモートデスクトップの従来の欠点を改善)
- ローカル環境を汚さない(必要なファイルはリモート側だけに配置)
Codespacesの設定共通化
GitHub Codespaces環境のカスタマイズ等は、.devcontainer/devcontainer.json
に記述する。VSCodeの設定やインストールしたい拡張機能の定義
など詳細は公式のドキュメント参照:
Create a development container using Visual Studio Code Remote Development