GitHub Codespaces

GitHub Codespaces は、長期的なプロジェクトであれ、プルリクエストのレビューのような短期的なタスクであれ、あらゆるアクティビティに対してクラウドを活用した開発環境を提供します。これらの環境は、Visual Studio Code またはブラウザーベースのエディターから利用できます。

環境

環境は、GitHub Codespaces の「バックエンド」部分です。コンパイル、デバッグ、復元など、ソフトウェア開発に関連するすべての計算処理はここで行われます。新しいプロジェクトで作業を始めたり、新しいタスクに取り組んだり、PR をレビューしたりする必要がある場合、クラウドホスト環境を簡単に立ち上げることができ、GitHub Codespaces がその設定を適切に行います。ソースコード、ランタイム、コンパイラ、デバッガー、エディター、カスタムのドットファイル設定、関連するエディター拡張機能など、プロジェクトで作業するために必要なすべてのものを自動的に設定します。

カスタマイズ

GitHub Codespaces はプロジェクトごとに完全にカスタマイズ可能です。これは、VS Code の Dev Containers 開発と同様に、プロジェクトのリポジトリに devcontainer.json ファイルを含めることで実現されます。

カスタマイズの例:

• 使用する Linux ベースのオペレーティングシステムを設定する。
• 様々なツール、ランタイム、フレームワークを自動的にインストールする。
• 一般的に使用されるポートをフォワーディングする。
• 環境変数を設定する。
• エディターの設定を構成し、好みの拡張機能をインストールする。

Codespace 固有の devcontainer.json 設定については、Codespaces の設定に関するドキュメントを参照してください。

ユーザーごとの dotfile 設定

ドットファイル (Dotfiles) は、ファイル名がドット (.) で始まるファイルです。通常、アプリケーションの設定情報が含まれており、ターミナル、エディター、ソース管理、その他の様々なツールの動作を制御できます。.bashrc、.gitignore、.editorconfig は、開発者によって一般的に使用されるドットファイルの例です。

Codespace を作成する際に、ドットファイルを含む GitHub リポジトリ、ファイルのターゲット場所、およびインストールコマンドを指定できます。

Codespace にドットファイル設定を追加する方法については、Codespaces のパーソナライズに関するドキュメントを参照してください。

はじめに

GitHub Codespaces の両方のクライアントには、入門用のトピックがあります。これらは、GitHub Codespaces へのサインイン、最初の Codespace の作成、そして好みのクライアントでの接続までを迅速に案内します。

• VS Code での Codespaces - GitHub Codespaces 拡張機能を使用して、環境に接続して作業します。
• ブラウザーでの Codespaces - ブラウザーベースのエディターを通じて Codespace に接続します。

拡張機能の作成者

VS Code 拡張機能 API は、リモートで実行する際の実装の詳細のほとんどを隠蔽しているため、多くの拡張機能は修正なしで GitHub Codespaces 環境で動作します。ただし、すべての機能が期待どおりに動作することを確認するために、Codespace で拡張機能をテストすることをお勧めします。詳細については、リモート開発と GitHub Codespaces のサポートに関する記事を参照してください。

ブラウザーベースのエディター

また、ブラウザー上で完結する、無料の軽量な Visual Studio Code 体験も利用できます。Web ベースのエディターを使用すると、GitHub からソースコードリポジトリを安全かつ迅速に参照し、軽微なコード変更を行うことができます。任意のリポジトリ、フォーク、またはプルリクエストをエディターで開くことができ、検索や構文ハイライトなど、VS Code の多くの機能を備えています。コードを実行またはデバッグしたい場合は、クラウドホスト環境または VS Code デスクトップに切り替えることができます。

このブラウザーベースのエディターにアクセスするには、github.com でリポジトリに移動し、. (ピリオドキー) を押すか、リポジトリの URL を github.dev/org/repo に変更します (github.com を github.dev に置き換えます)。

制限: シークレットモードでブラウザーを実行している場合や、広告ブロッカーを有効にしている場合、Web ベースのエディターを使用できないことがあります。

注: このエディターは現在テクニカルプレビューです。今すぐお試しいただき、https://github.co/browser-editor-feedback にてフィードバックをお寄せください。

既知の制限と対応策

Codespaces、特に Web 上の VS Code で作業する際には、いくつかの制限事項に留意する必要があります。これらの制限の一部には、一貫した開発体験を提供するための回避策や対応策が用意されています。

いくつかの問題 (特にキーボードショートカットや、デスクトップでの回避策が記載されているもの) については、Codespace を プログレッシブ Web アプリケーション (PWA) としてインストールして使用することができます。

一部の拡張機能は Web で動作が異なります

よくある質問

なぜ拡張機能がブラウザーにインストールできないのですか？

拡張機能に組み込まれた前提条件があるか、デスクトップ上で実行する必要がある拡張機能が少数存在します。例として、拡張機能がデスクトップ上の VS Code のインストールからファイルにアクセスする場合や、拡張機能がデスクトップ環境で実行されなければならない実行可能ファイルに依存する場合などがあります。そのような拡張機能をブラウザーにインストールしようとすると、その拡張機能が利用できないことが通知されます。

注意: このような拡張機能は、デスクトップで実行されている VS Code から Codespace に接続する際には、引き続き使用できます。

VS Code がクリップボードを読み取ることを許可するにはどうすればよいですか？

場合によっては、VS Code がクリップボードから読み取る際に許可を求めることがあります。ブラウザーの設定 (「サイトの権限」を検索) から、またはアドレスバーの右側にあるこのオプションを探すことで、クリップボードへのアクセスを許可できるはずです。

VS Code にクリップボードへのアクセスを許可したら、操作を再試行できます。

VS Code が常に新しいタブやウィンドウを開くことを許可するにはどうすればよいですか？

セキュリティ対策として、ブラウザーが VS Code による新しいタブやウィンドウのオープンをブロックすることがあります。この場合、VS Code はブロック操作を検出し、ユーザーに明示的にプロンプトを表示します。しかし、ブラウザーのナビゲーションバーのコンテキストメニューからサイト設定を開き、ポップアップウィンドウを許可することで、VS Code が常に新しいウィンドウやタブを開くことを許可できます。

ブラウザー上の VS Code がローカルのファイルやフォルダーにアクセスすることを許可するにはどうすればよいですか？

ブラウザーから VS Code でローカルのファイルやフォルダーを開くには、ブラウザーが File System Access API をサポートしている必要があります。現在、Microsoft Edge と Google Chrome の両方がこのレベルのサポートを提供しています。ブラウザーで VS Code を使用する際にローカルのファイルやフォルダーにアクセスしたい場合は、これら2つのブラウザーのいずれかに切り替えることを検討してください。

質問またはフィードバック

ご質問がある場合は、GitHub Codespaces のトラブルシューティングガイドを参照してください。フィードバックを提供したい場合は、GitHub Codespaces のディスカッションに問題を投稿できます。