Firebase Studio でアプリを公開する

Firebase Studio には複数の公開オプションがあり、プロジェクトのニーズに最適な方法を選択できます。利用可能なオプションの概要は次のとおりです。

  • Firebase App Hosting: App Hosting は、動的 Next.js アプリケーションと Angular アプリケーションの公開に最適であり、組み込みフレームワークのサポート、GitHub との統合、Firebase AuthenticationCloud FirestoreFirebase AI Logic などの他の Firebase プロダクトとの統合を提供します。

    App Prototyping agent を使用して Next.js アプリを開発した場合は、数回クリックするだけで Firebase Studio から直接公開できます。

  • Firebase Hosting: ウェブアプリ、静的ウェブ コンテンツ(HTML、CSS、JavaScript、画像、その他の静的アセット)、シングルページ アプリのホスティングに適しています。Firebase Hosting は、グローバル CDN、無料の SSL 証明書、カスタム ドメインのサポートにより、高速なコンテンツ配信を提供します。

  • Cloud Run: Cloud Run を使用して、コンテナ化されたアプリケーションをデプロイします。任意のプラットフォームで実行できるスケーラブルでポータブルなアプリケーションを公開する場合に適しています。

  • その他のデプロイ オプション: 他のプラットフォームや独自のサーバーなど、任意のホスティング ソリューションにデプロイします。

Firebase App Hosting を使用してアプリを公開、モニタリングする

App Prototyping agent を使用してアプリを作成した場合は、Firebase Studio から直接 Firebase App Hosting に公開できます。

App Hosting を使用してアプリを公開する

App Hosting を設定すると、Firebase Studio によって Firebase プロジェクトが作成され、Cloud Billing アカウントのリンク手順が示されます。

アプリを Firebase App Hosting に公開するには:

  1. [公開] をクリックして新しい Firebase プロジェクトを作成し、App Hosting の設定を開始します。[アプリを公開する] ペインが表示されます。

  2. [Firebase プロジェクト] の手順では、作成された Firebase プロジェクトの名前をメモして、[次へ] をクリックします。

  3. [Cloud Billing アカウントをリンク] の手順では、次のいずれかを選択します。

    • Firebase プロジェクトにリンクする Cloud Billing アカウントを選択します。

    • Cloud Billing アカウントをお持ちでない場合、または新しいアカウントを作成したい場合は、[Cloud Billing アカウントを作成] をクリックします。そうすると、Google Cloud コンソールが開き、そこで 新しいセルフサービス Cloud Billing アカウントを作成できます。アカウントを作成したら、Firebase Studio に戻り、[Cloud Billing をリンク] リストからアカウントを選択します。

  4. [次へ] をクリックします。Firebase Studio は、ワークスペースに関連付けられたプロジェクトに請求先アカウントをリンクします。このプロジェクトは、Gemini API キーを自動生成したとき、または [公開] をクリックしたときに作成されます。続いて App Hosting が、Google Cloud にアプリのフルマネージド環境を設定します。

  5. [最初のロールアウトを作成する] をクリックします。Firebase StudioApp Hosting のロールアウトを開始します。完了するまでに最大で 10 分かかります。裏側で行われていることの詳細については、App Hosting ビルドプロセスをご覧ください。

  6. ロールアウトが完了すると、App Hosting オブザーバビリティを備えた URL とアプリ分析情報とともに [アプリの概要] が表示されます。Firebase で生成されたドメインの代わりに、カスタム ドメイン(example.com や app.example.com など)を使用するには、Firebase コンソールでカスタム ドメインを追加します。

App Hosting の詳細については、App Hosting とその仕組みを理解するをご覧ください。

App Hosting オブザーバビリティでアプリをモニタリングする

App Hosting の [アプリの概要] パネルには、アプリに関する主な指標と情報が表示されます。App Hosting に組み込まれたオブザーバビリティ ツールを使用して、ウェブアプリのパフォーマンスをモニタリングできます。サイトがロールアウトされたら、[公開] をクリックして概要にアクセスできます。このパネルでは次のことができます。

  • [ロールアウトを作成] をクリックして、アプリの新しいバージョンをリリースします。
  • アプリへのリンクを共有するか、[アプリにアクセスする] でアプリを直接開きます。
  • リクエストの合計数や最新のロールアウトのステータスなど、過去 7 日間のアプリのパフォーマンスの概要を確認します。[詳細を表示] をクリックすると、Firebase コンソールでさらに詳細な情報にアクセスできます。
  • 過去 24 時間にアプリが受信したリクエスト数を HTTP ステータス コード別にグラフで表示します。

アプリの概要パネルを閉じた場合は、[公開] をクリックしていつでも再び開くことが可能です。

App Hosting ロールアウトの管理とモニタリングについての詳細は、ロールアウトとリリースを管理するをご覧ください。

App Hosting サイトをロールバックする

アプリの連続バージョンを App Hosting にデプロイした場合は、以前のバージョンのいずれかにロールバックできます。これを削除することもできます。

  • 公開済みのサイトをロールバックするには:

    1. Firebase コンソールで App Hosting を開きます。

    2. アプリのバックエンドを見つけて、[表示]、[ロールアウト] の順にクリックします。

    3. ロールバックするデプロイの横にある [その他] をクリックし、[このビルドにロールバックする] を選択して、確認します。

    詳細については、ロールアウトとリリースを管理するをご覧ください。

  • ウェブから App Hosting ドメインを削除するには:

    1. Firebase コンソールApp Hosting を開き、Firebase Studio アプリ セクションで [表示] をクリックします。

    2. [バックエンド情報] セクションで [管理] をクリックします。[ドメイン] ページが読み込まれます。

    3. ドメインの横にある [その他] をクリックし、[ドメインを無効にする] を選択して、確認します。

    これにより、ドメインがウェブから削除されます。App Hosting バックエンドを完全に削除するには、バックエンドを削除するの手順に沿って操作します。

Firebase Hosting

ウェブアプリは、Firebase Studio ワークスペースから Firebase Hosting に公開できます。ウェブアプリを Firebase Hosting に公開する前に、Firebase プロジェクトを作成してアプリを登録します。

必要な Firebase プロジェクトの権限がない場合は、Firebase コンソールの [ユーザーと権限] ページで該当するロールを割り当ててもらうよう Firebase プロジェクトのオーナーに依頼してください。オーナーの確認や割り当てなど、Firebase プロジェクトへのアクセスについてご不明な点がある場合は、Firebase プロジェクトの権限とアクセスをご覧ください。

Firebase Studio から Firebase Hosting にアプリをデプロイするには:

  1. Firebase Studio ワークスペースを開きます。App Prototyping agent を使用している場合は、コード切り替えアイコン [コードに切り替え] をクリックして Code ビューを開きます。

  2. ナビゲーション パネルの Firebase Studio アイコンをクリックして Firebase Studio パネルを開き、[Firebase Hosting] セクションを開きます。

  3. [Firebase を認証] をクリックし、ターミナル ウィンドウのプロンプトに従って Firebase アカウントを認証します。

  4. [Firebase Hosting を初期化] をクリックし、ターミナル ウィンドウのプロンプトに従って、デプロイ構成を設定します。

  5. アプリをデプロイするには、Firebase Studio パネルの [Firebase Hosting] セクションで [プロダクションにデプロイ] または [チャンネルにデプロイ] をクリックします。

Cloud Run

Cloud Run を使用してデプロイする前に、Google Cloud プロジェクトを設定して Cloud Billing を有効にしてください。

  1. Firebase Studio ワークスペースを開きます。App Prototyping agent を使用している場合は、コード切り替えアイコン [コードに切り替え] をクリックして Code ビューを開きます。

  2. ナビゲーション パネルで Firebase Studio アイコンをクリックして Firebase Studio パネルを開き、[Cloud Run にデプロイ] をクリックします。

  3. [このワークスペースに、自分の Google アカウントを使用して Google Cloud リソースにアクセスすることを許可する] を選択してから、ダイアログ ウィンドウで課金が有効になっている Google Cloud プロジェクトを選択します。

  4. Firebase Studio パネルの [Cloud Run] セクションで [認証] をクリックし、プロンプトに従って認証します。

  5. [デプロイ] をクリックし、プロンプトに従ってデプロイ構成を設定してアプリをデプロイします。

次のステップ