Firebase Studio ワークスペースについて

Firebase Studio は、フレームワークとライブラリを幅広く組み合わせてアプリケーションを構築するプロセスを簡素化する、クラウドベースのコラボレーション開発環境を提供します。

Firebase Studio ワークスペースを設定すると、完全な機能と柔軟性を備えた開発環境にアクセスして共有できます。Firebase Studio ワークスペースは任意のデバイスからアクセスでき、統合されたツールを使用して、ユーザーとチームの開発プロセスを効率化できます。

ワークスペースの作成

Firebase Studio のワークスペースは、アプリケーションの開発に必要なものがすべて揃った開発環境です。コード、コードエディタ（プロジェクトに関連するプラグインを含む）、アプリ開発をサポートするツールチェーンが含まれています。ローカル デスクトップ開発環境で新しいプロジェクトを作成するのと同様ですが、コンピュータとオペレーティング システム全体が事前構成され、アプリケーションの構築に専用に使用されます。アプリケーションはクラウド内のブラウザで実行され、どこからでもアクセスできます。

Firebase Studio ワークスペースは単一のコードベースを含むように最適化されているため、異なるアプリケーションの環境とシステムレベルの依存関係を相互に分離できます。複数のワークスペースを作成して、さまざまなアプリケーションやフレームワークで使用できます。

新しいワークスペースを作成するには:

ワークスペースを複製する

Firebase Studio ワークスペースを複製すると、home/user ディレクトリ内のすべての要素を含むプロジェクトのコピーが作成されます。これは、オリジナルに影響を与えることなくプロジェクトを試す場合や、既存のプロジェクトを新しいプロジェクトの出発点として使用する場合に便利です。

ワークスペースを複製するには:

  1. Firebase Studio ホームページで、コピーするワークスペースの横にある メニュー > [複製] をクリックします。

  2. 新しいワークスペースの名前を入力し、[複製] をクリックします。新しいワークスペースが作成され、ワークスペースのリストに追加されます。 ß 注: 大規模なワークスペースの複製には数分かかることがあります。新しいワークスペースが読み込まれない場合は、5 分待ってからページを更新してください。

  3. （省略可）元のワークスペースに、リンクされた Firebase プロジェクトが含まれている場合は、新しいワークスペース用に別の Firebase プロジェクトを作成することを検討してください。これにより、元のワークスペースにリンクされている Firebase プロジェクトが新しいワークスペースによって変更されるのを防ぐことができます。Firebase プロジェクトを作成するには:

    1. 新しいワークスペースを開き、Gemini に Firebase プロジェクトを作成するようリクエストします。
    2. .env や .firebaserc など、Firebase プロジェクトを参照しているファイルを更新します。

ワークスペースを構成する

Firebase Studio は Nix を使用して、各ワークスペースの環境構成を定義します。Nix は純粋に機能的なパッケージ マネージャーであり、各依存関係に一意の ID を割り当てます。つまり最終的に、環境には、同じ依存関係の複数のバージョンをシームレスに含めることができます。また、再現可能で宣言的です。つまり、Firebase Studio のコンテキストでは、ワークスペース間で Nix 構成ファイルを共有して、同じ環境構成を読み込むことができます。詳しくは、Nix + Firebase Studio をご覧ください。

.idx/dev.nix ファイルを作成または編集する

環境構成は、コード リポジトリ内の .idx/dev.nix ファイルで定義されています。このファイルでは、ワークスペースに追加するすべてのコンポーネントが指定されています。以下に例を示します。

Firebase Studio でアプリのプレビューを有効にする基本的なワークスペース環境の構成については、次の .idx/dev.nix ファイルの例をご覧ください。

{ pkgs, ... }: {

  # Which nixpkgs channel to use.
  channel = "stable-23.11"; # or "unstable"

  # Use https://search.nixos.org/packages to find packages
  packages = [
    pkgs.nodejs_20
  ];

  # Sets environment variables in the workspace
  env = {
    SOME_ENV_VAR = "hello";
  };

  # Search for the extensions you want on https://open-vsx.org/ and use "publisher.id"
  idx.extensions = [
    "angular.ng-template"
  ];

  # Enable previews and customize configuration
  idx.previews = {
    enable = true;
    previews = {
      web = {
        command = [
          "npm"
          "run"
          "start"
          "--"
          "--port"
          "$PORT"
          "--host"
          "0.0.0.0"
          "--disable-host-check"
        ];
        manager = "web";
        # Optionally, specify a directory that contains your web app
        # cwd = "app/client";
      };
    };
  };
}

新しい構成を適用

dev.nix 構成ファイルを追加または更新すると、Firebase Studio には、環境を再ビルドするためのプロンプトが右下に表示されます。環境の再ビルドにかかる時間は、構成に必要なパッケージの数によって異なります。

環境ビルドの失敗をデバッグする

構成ファイルは機械可読コードであるため、エラーが発生する可能性があります。その場合、環境のビルドに失敗し、開始されない可能性があります。Firebase Studio には、リカバリー 環境を開始するオプションが表示されます。このワークスペースには、定義した構成は含まれておらず、基本的な Code OSS のみが実行されます。これにより、dev.nix 構成ファイルのエラーを修正して環境を再ビルドできます。

次のステップ