Skip to main content
We publish frequent updates to our documentation, and translation of this page may still be in progress. For the most current information, please visit the English documentation.

GitHub Codespaces の詳細

GitHub Codespaces のしくみを理解します。

GitHub Codespaces は、クラウドベースのインスタント開発環境であり、コンテナーを使用して開発用の共通言語、ツール、ユーティリティを提供します。 また、GitHub Codespaces は構成可能で、プロジェクトに合わせてカスタマイズされた開発環境を作成できます。 プロジェクト用のカスタム開発環境を構成することにより、プロジェクトのすべてのユーザーに対して繰り返し可能な codespace 構成を作成できます。

codespace を作成する

codespace を作成するためのエントリ ポイントは数多くあります。

  • 新しいプロジェクトを開始する GitHub テンプレートまたは GitHub.com 上の任意のテンプレート リポジトリから
  • 新機能の作業を行うリポジトリ内のブランチから
  • 進行中の作業を探索するオープンの pull request から
  • 特定の時点のバグを調査するリポジトリ内のコミットから

codespace は、GitHub.com、Visual Studio Code、または GitHub CLI を使用して作成できます。

何らかのテストを行う必要がある場合、または同じ codespace に戻って長期間の機能作業を行うことができる場合、codespace をエフェメラルにすることができます。

詳細については、「リポジトリの codespace の作成」、「テンプレートから codespace を作成する」、「既存の codespace を開く」を参照してください。

: リポジトリごと、さらにはブランチごとに 1 つ以上の codespace を作成できます。 ただし、作成できる codespace の数と、同時に実行できる codespace の数には制限があります。 codespace の最大数に達してからさらに作成しようとすると、新しい codespace を作成する前に既存のものを削除する必要があることを示すメッセージが表示されます。

codespace の作成プロセス

codespace を作成するときは、codespace を使用できるようになるまでにバックグラウンドでさまざまな手順が発生します。

手順 1: VM とストレージを codespace に割り当てる

codespace を作成すると、リポジトリの (または、テンプレートから codespace を作成する場合はテンプレート リポジトリの) シャロー クローンが作成されます。 リポジトリは、専用と個人用の両方である Linux 仮想マシンにクローンされます。 専用の VM を使用すると、そのマシンから使用できるコンピューティング リソースのセット全体を確保できます。 必要に応じて、これにより、コンテナーへの完全なルート アクセス権を取得することもできます。

手順 2: コンテナーを作成する

GitHub Codespaces では、開発環境としてコンテナーが使用されます。 このコンテナーは、devcontainer.json ファイルおよび必要に応じて Dockerfile で定義できる構成に基づいて作成されます。 GitHub の空のテンプレートから、または devcontainer.json ファイルのないリポジトリから codespace を作成する場合、GitHub Codespaces で既定のイメージが使用されます。これには、使用可能な言語とランタイムが多数あります。 詳細については、開発コンテナーの概要に関するページをご覧ください。 既定のイメージの内容について詳しくは、microsoft/vscode-dev-containers リポジトリを参照してください。

注: codespace で Git フックを使用し、git テンプレート ディレクトリ内の何らかのものを codespace に適用する場合、コンテナーの作成後に手順 4 でフックを設定する必要があります。

コンテナーの作成前にリポジトリがホスト VM に複製されるため、手順 4 の postCreateCommandを使用して devcontainer.json 構成ファイルでフックを設定しない限り、git テンプレート ディレクトリ内のものは codespace に適用されません。 詳細については、「手順 4: 作成後のセットアップ」を参照してください。

手順 3: codespace に接続する

コンテナーが作成され、その他の初期化が実行されると、codespace に接続されます。 次の方法で接続できます。

手順 4: 作成後のセットアップ

codespace に接続された後、devcontainer.json ファイルで指定した構成に基づいて、自動セットアップが引き続きビルドされる場合があります。 postCreateCommandが表示され、postAttachCommand が実行される場合があります。

codespace で Git フックを使用する場合は、postCreateCommand などの devcontainer.jsonライフサイクル スクリプトを使用してフックを設定します。 詳しい情報については、VS Code のドキュメントの「devcontainer.json リファレンス」を参照してください。

GitHub Codespaces のパブリックのドットファイル リポジトリがある場合、それを新しい codespace で使用できるように有効にすることができます。 有効にすると、ドットファイルがコンテナーに複製され、インストール スクリプトが呼び出されます。 詳しくは、「アカウントの GitHub Codespaces をパーソナライズする」をご覧ください。

最後に、リポジトリから codespace を作成した場合、リポジトリの履歴全体が完全なクローンでコピーされます。 テンプレートから codespace を作成した場合、テンプレート リポジトリの完全な履歴は保持されません。代わりに、空白のテンプレートを使用するのでない限り、テンプレート リポジトリの内容に対する最初のコミットから始めます。

作成後のセットアップ中も、統合ターミナルを使用してファイルを編集できますが、作業と実行中のコマンドの間の競合状態を回避するように注意してください。

Codespaces のライフサイクル

ファイルを codespace に保存する

使用しているエディターに応じて、通常の方法でファイルに対する変更を保存します。

Visual Studio Code の codespaces で作業する場合は、自動保存を有効にして、変更が常に保存されるようにすることができます。

codespace の終了または停止

codespace は、使用している間は実行され続けますが、一定時間非アクティブになるとタイムアウトします。 エディターとターミナル出力からのファイルの変更はアクティビティとしてカウントされるため、ターミナル出力が継続されていれば codespace はタイムアウトしません。 既定の非アクティブ タイムアウト期間は 30 分です。 作成する codespace に対して個人用タイムアウト設定を定義できますが、これは組織のタイムアウト ポリシーによって却下される可能性があります。 詳しくは、「codespace のタイムアウト期間を設定する」をご覧ください。

codespace がタイムアウトすると実行は停止しますが、ブラウザー タブから (ブラウザーで codespace を使用している場合)、VS Code 内から、または https://github.com/codespaces にある codespace の一覧から再起動できます。

次の方法で codespace を停止できます。

  • ブラウザーで: https://github.com/codespaces にある codespace の一覧で、停止する codespace の右側にある省略記号 ( ... ) をクリックし、 [codespace の停止] をクリックします。
  • VS Code で: the Visual Studio Code Command Paletteを開き (たとえば、Ctrl + Shift + Enter キー (Windows/Linux) または Shift + Command + P キー (Mac) を押す)、「Codespaces: stop」と入力して Enter キーを押します。
  • JetBrains クライアントで、GitHub Codespaces ツール ウィンドウの上部にある停止ボタンをクリックします。 詳細については、「codespace の停止と開始」の「JetBrains IDE」タブを参照してください。
  • ターミナル ウィンドウで: GitHub CLI コマンド gh codespace stop を使用します。 詳細については、「GitHub Codespaces と GitHub CLI の使用」を参照してください。

stop コマンドを実行せずに codespace を終了した (たとえばブラウザー タブを閉じる) 場合、または操作なしで codespace を実行したままにした場合、codespace とその実行中のプロセスは、非アクティブ タイムアウト期間中は続行されます。

codespace を終了または停止すると、codespace に再度接続するまで、コミットされていない変更はすべて保持されます。

アプリケーションの実行

ポート転送を使用すると、Codespaces 内で実行されている TCP ポートにアクセスできます。 たとえば、codespace 内のポート 4000 で Web アプリケーションを実行している場合、そのポートを自動的に転送して、ブラウザーからアプリケーションをアクセスできるようにします。

ポートの転送は、リモート マシンからアクセス可能にするポートを決定します。 ポートを転送しない場合でも、そのポートには、codespace 自体内で実行されている他のプロセスにアクセスできます。

codespace 内でのポートの転送のしくみを示す図

GitHub Codespaces 内で実行されているアプリケーションでポートをコンソールに出力すると、GitHub Codespaces で localhost の URL パターンが検出され、ポートが自動的に転送されます。 ターミナルで URL をクリックするか、VS Code の右下隅にポップアップ表示される "トースト" 通知メッセージ内のリンクをクリックして、ブラウザーでポートを開くことができます。 GitHub Codespaces の既定では、HTTP を使用してポートが転送されます。 ポートの転送の詳細については、「Forwarding ports in your codespace」 (codespace でのポートの転送) を参照してください。

ポートは自動的に転送できますが、インターネットからパブリックにアクセスすることはできません。 既定では、すべてのポートはプライベートですが、手動で、組織またはパブリックでポートを使用できるようにして、URL を使用してアクセスを共有できます。 詳細については、「Sharing a port」 (ポートの共有) を参照してください。

初めて codespace に入ったときにアプリケーションを実行すると、高速の内部開発ループを実現できます。 編集すると、変更は自動的に保存され、転送されたポートで使用できるようになります。 変更を表示するには、ブラウザーで実行中のアプリケーションのタブに戻って更新します。

変更のコミットとプッシュ

Git は既定で codespace にインストールされるため、既存の Git ワークフローに依存できます。 Git を codespace で操作するには、ターミナルを使うか、VS Code または JetBrains のソース管理機能を使います。

既存のリポジトリで作業している場合は、リポジトリ内のブランチ、コミット、または pull request から codespace を作成することも、アクティブな codespace 内から新しいまたは既存のブランチに切り替えることもできます。 GitHub Codespaces はエフェメラルになるように設計されているため、分離された環境として使用して、実験、チームメイトの pull request の確認、またはマージ競合の修正を行うことができます。

リポジトリへの読み取りアクセス権しかない場合、フォークできる間はリポジトリの codespace を作成できます。 codespace からコミットを行うと、GitHub Codespaces によってリポジトリのフォークが自動的に作成されるか、それともアップストリーム リポジトリ用のフォークが既にある場合は codespace が既存のフォークにリンクされます。

テンプレートから作成された codespace で作業している場合、Git は既定でインストールされますが、作業を永続化し、他のユーザーと共有するには、codespace をリモート リポジトリに発行する必要があります。 GitHub の空のテンプレートから開始する場合は、codespace 内でソース管理の使用を開始するには、まずワークスペースを Git リポジトリとして初期化 (たとえば「git init」と入力) する必要があります。

詳細については、「Codespace でソース コントロールを使用する」を参照してください

注: codespace からのコミットは、 https://github.com/settings/profile で構成された名前とパブリック メールに起因します。 スコープがリポジトリにされ、GITHUB_TOKEN として環境に含まれたトークンと、GitHub 資格情報が認証に使用されます。

拡張機能またはプラグインを使用して codespace をカスタマイズする

codespace 内にプラグインと拡張機能を追加して、JetBrains と VS Code のエクスペリエンスをそれぞれカスタマイズできます。

VS Code 拡張機能

VS Code デスクトップ アプリケーションまたは Web クライアントの codespaces で作業している場合は、Visual Studio Code Marketplace から必要な拡張機能を追加できます。 拡張機能が GitHub Codespaces でどのように実行されるかについては、VS Code ドキュメントの「リモート開発と GitHub Codespaces のサポート」を参照してください。

既に VS Code を使っている場合は、[設定の同期] を使って、ローカル インスタンスと作成した codespace との間で拡張機能、設定、テーマ、キーボード ショートカットを自動的に同期できます。

JetBrains プラグイン

JetBrains IDE で codespace を操作する場合は、JetBrains Marketplace からプラグインを追加できます。

  1. [JetBrains クライアント] をクリックし、 [基本設定] をクリックします。

  2. [基本設定] ダイアログ ボックスで、 [ホスト上のプラグイン] をクリックして、リモートで実行されている完全な JetBrains IDE にプラグインをインストールするか、 [プラグイン] をクリックしてローカル クライアントにプラグインをインストールして、たとえばユーザー インターフェイスのテーマを変更します。

  3. [Marketplace] タブをクリックします。

    [プラグイン ホスト上] の [Marketplace] タブのスクリーンショット

  4. 必要なプラグインの横にある [インストール] をクリックします。

参考資料