momabrouk18-eng/Website

App Hosting の基本

説明

このスキルにより、エージェントは Firebase App Hosting を使って、Next.js、Angular などのモダンなフルスタック Web アプリケーションをデプロイ・管理できるようになります。

重要: App Hosting を使用するには、Firebase プロジェクトが Blaze 料金プランである必要があります。ユーザーを以下のリンクに誘導してプランをアップグレードしてください。 https://console.firebase.google.com/project/_/overview?purchaseBillingPlan=metered

Hosting と App Hosting の比較

次の場合は Firebase Hosting を選んでください:

• 静的サイト（HTML/CSS/JS）をデプロイする場合。
• SSR を使わないシンプルな SPA（React、Vue など）をデプロイする場合。
• CLI を通じてビルド・デプロイプロセスを完全に制御したい場合。

次の場合は Firebase App Hosting を選んでください:

• Next.js や Angular などのサポート対象のフルスタックフレームワークを使用している場合。
• サーバーサイドレンダリング（SSR）や ISR が必要な場合。
• ゼロコンフィギュレーションで自動化された "git push to deploy" ワークフローを希望する場合。

App Hosting へのデプロイ

ソースからのデプロイ

これはほとんどのユーザーにおすすめのフローです。

1. firebase.json に apphosting ブロックを設定します。

   {
     "apphosting": {
       "backendId": "my-app-id",
       "rootDir": "/",
       "ignore": [
         "node_modules",
         ".git",
         "firebase-debug.log",
         "firebase-debug.*.log",
         "functions"
       ]
     }
   }
   

2. apphosting.yaml を作成または編集します。詳細は設定を参照してください。

3. アプリが機密キーに安全にアクセスする必要がある場合は、npx -y firebase-tools@latest apphosting:secrets コマンドを使用してシークレットを設定・アクセス権を付与します。

4. デプロイの準備ができたら npx -y firebase-tools@latest deploy を実行します。

GitHub による自動デプロイ (CI/CD)

別の方法として、GitHub リポジトリに接続されたバックエンドを設定し、「git push」による自動デプロイを実現することもできます。これは上級ユーザー向けであり、App Hosting の使用に必須ではありません。CLI コマンドを使用した設定方法の詳細は CLI コマンドを参照してください。

エミュレーション

Firebase Local Emulator Suite を使用してアプリをローカルでテストする方法の詳細はエミュレーションを参照してください。