Firebase Extensionsを使用して、ウェブアプリに新しい機能をすばやく追加します

1.はじめに

目標

このコードラボでは、あなたはの助けを借りて、オンライン市場のアプリに機能を追加しますFirebase拡張機能。このコードラボを通じて、拡張機能がアプリの開発と管理タスクに費やす時間を短縮するのにどのように役立つかを理解できます。

3b6977f679c67db.png

構築するもの

このコードラボでは、オンラインマーケットプレイスのWebアプリに次の機能を追加します。

  • 画像の読み込みを高速化して、ユーザー維持率を高めます
  • データベースのエントリを制限して、パフォーマンスを向上させ、請求額を削減します
  • 古いユーザーデータの自動削除を実装して、ユーザーデータ保護を強化します

あなたが学ぶこと

  • 一般的なユースケースの拡張機能を見つける方法
  • プロジェクトに拡張機能をインストールして構成する方法
  • プロジェクトで拡張機能を維持(監視、更新、およびアンインストール)する方法

このコードラボは、FirebaseExtensionsに焦点を当てています。このコードラボで述べた他のFirebase製品の詳細については、を参照してくださいFirebaseドキュメントおよびその他のcodelabs

必要なもの

  • 最新のWebブラウザーがインストールされているコンピューター(Chromeを推奨)
  • Googleアカウント

2.Firebaseプロジェクトを作成して設定します

Firebaseプロジェクトを作成する

  1. Firebaseコンソール、クリックプロジェクトを追加し、FirebaseプロジェクトFriendlyMarket名前付けます。
  2. プロジェクト作成オプションをクリックします。 Firebaseの利用規約に同意します。このアプリではアナリティクスを使用しないため、Googleアナリティクスの設定はスキップしてください。
  3. プロビジョニングするプロジェクトのために待ってから、[続行]クリックします。

作成するアプリケーションは、ウェブアプリで利用できるいくつかのFirebase製品を使用します。

  • Firebase認証は、簡単にユーザーを識別するために
  • Firebaseリアルタイムデータベースをクラウドに構造化データを保存し、瞬時に通知を取得するときに、データの更新
  • クラウド内の画像を保存するFirebaseためのクラウドストレージ

次に、Firebaseコンソールを使用して、これらのFirebase製品を有効にして構成します。

メールログインを有効にする

認証はこのコードラボの焦点では​​ありませんが、それを使用するすべての人を一意に識別するために、アプリに何らかの形式の認証を含めることが重要です。メールログインを使用します。

  1. Firebaseコンソールで、左パネルの開発をクリックします。
  2. 認証]クリックし、[サインインのメソッドタブをクリックします(または、こちらをクリックしてくださいサインインのメソッドタブに直接移動します)。
  3. 位置でのスイッチをオンにし、[保存]クリックし、プロバイダ・サインインリストに電子メール/パスワード]クリックします。

ed0f449a872f7287.png

リアルタイムデータベースを有効にする

このアプリは、Firebase Realtime Databaseを使用して、販売するアイテムを保存します。

  1. Firebaseコンソールの左側のパネルで、開発セクションでは、クリックデータベースを
  2. クラウドFirestoreペイン過去のページスクロールダウンし、リアルタイムデータベースペインデータベースを作成]をクリックします。

cf8de951d2ab2e94.png

  1. ロックモードの[開始]を選択し、[有効]をクリックします。

セキュリティルールを設定する

次に、このアプリに必要なセキュリティルールを設定します。これらのアプリのセキュリティを確保するために、いくつかの基本的な例ルールです。これらのルールでは、誰でも販売アイテムを表示できますが、これらのルールでは、サインインしたユーザーのみが他の読み取りと書き込みを実行できます。これらのルールの詳細について心配する必要はありません。それらをコピーして貼り付けるだけで、アプリを起動して実行できます。

  1. リアルタイムデータベースダッシュボードの上部には、[ルール]タブをクリックします。

e233a24a38b37e95.png

  1. コピーしてルール]タブでルールフィールドに次のルールセットを貼り付けます。
{
  "rules": {
    ".read": false,
    ".write": false,
      "drafts": {
        ".indexOn": "seller",
        ".read": "auth.uid !== null",
        ".write": "auth.uid !== null"
    },
    "sellers": {
        ".read": "auth.uid !== null",
        ".write": "auth.uid !== null"
    },
      "forsale": {
        ".read": true,
        ".write": "auth.uid !== null"
      }
  }
}
  1. 公開]をクリックします。

クラウドストレージを有効にする

このアプリは、Cloud Storage for Firebaseを使用して、販売するアイテムの画像を保存します。

  1. Firebaseコンソールの左側のパネルで、開発セクションでは、クリックしてくださいストレージを
  2. 始めましょう]をクリックします。

889013b9c7b8897c.png

  1. (、[次へ]クリックし、既定の場所を維持し、[完了]クリックします)あなたのデフォルトのストレージバケットを作成するためのデフォルトを受け入れます。

次に、このアプリに必要なセキュリティルールを設定します。これらのルールは、認証されたユーザーが新しい画像を投稿することのみを許可しますが、リストされたアイテムの画像を誰でも表示することを許可します。

  1. ストレージダッシュボードの上部には、[ルール]タブをクリックします。

e7003646b429500b.png

  1. コピーしてルール]タブでルールフィールドに次のルールセットを貼り付けます。
rules_version = '2';
service firebase.storage {
  match /b/{bucket}/o {
    
    match /{allPaths=**} {
      allow read, write: if request.auth != null;
    }
    
    match /friendlymarket/{ImageId} {
      allow read;
      allow write: if request.auth != null;
    }
    
  }
}
  1. 公開]をクリックします。

3.サンプルアプリを実行します

StackBlitzプロジェクトをフォークする

このコードラボでは、あなたが使用してアプリの構築と展開StackBlitz 、それに統合されたいくつかのFirebaseのワークフローを持っているオンラインエディタを。 Stackblitzは、ソフトウェアのインストールや特別なStackBlitzアカウントを必要としません。

StackBlitzを使用すると、プロジェクトを他のユーザーと共有できます。 StackBlitzプロジェクトのURLを持っている他の人は、あなたのコードを見てプロジェクトをフォークすることはできますが、StackBlitzプロジェクトを編集することはできません。

  1. :起動コードのために、このURLに移動しますhttps://stackblitz.com/edit/friendlymarket-codelab
  2. StackBlitzページの上部には、フォークをクリックします。

22c44cf92ed26208.png

これで、独自のStackBlitzプロジェクトとして開始コードのコピーが作成されました。あなたが署名しなかったので、あなたの「アカウントは」と呼ばれる@anonymousが、のOKという。プロジェクトには、一意のURLとともに一意の名前があります。すべてのファイルと変更は、このStackBlitzプロジェクトに保存されます。

FirebaseWebアプリをプロジェクトに追加します

  1. StackBlitzでは、あなたのビューsrc/firebase-config.jsファイルを。ここにFirebase構成オブジェクトを追加します。
  2. 戻るFirebaseコンソールで、クリックして、プロジェクトの概要ページに移動し、プロジェクトの概要をトップに左。
  3. プロジェクトの概要ページの中央にあるWebアイコンをクリックします58d6543a156e56f9.png新しいFirebaseWebアプリを作成します。 88c964177c2bccea.png
  4. ニックネームFriendlyMarketコードラボでアプリを登録します。
  5. このコードラボのために、また、このアプリのためのホスティングFirebaseを設定する]チェックボックスをオンにしないでください。代わりに、StackBlitzプレビューペインを使用します。
  6. 登録アプリをクリックします。
  7. アプリのFirebase構成オブジェクトをクリップボードにコピーします。コピーしないでください<script>タグを。注:後で設定を見つける必要がある場合は、指示に従ってくださいここに

6c0519e8f48a3a6f.png

  1. コンソールに[続行]クリックします。

プロジェクトの構成をアプリに追加します。

  1. 戻るStackBlitzで、に行くsrc/firebase-config.jsファイル。
  2. 構成スニペットをファイルに貼り付けます。実行すると、次のようになります(ただし、構成オブジェクトに独自のプロジェクトの値が含まれます)。

177602cbe84f873d.png

このアプリの出発点は何ですか?

StackBlitz画面の右側にあるインタラクティブプレビューを見てください。

f3ec800f27fa49b7.png

このコードラボは、基本的なマーケットプレイスアプリのコードから始めます。すべてのユーザーが販売アイテムのリストを表示し、リンクをクリックしてアイテムの詳細ページを表示できます。ユーザーがサインインすると、販売者の連絡先情報が表示されるので、価格を交渉してアイテムを購入できます。

アプリをお試しください:

  1. ホーム画面の上部にあるボタンでサインインします。偽のメールアドレス、名前、パスワードを使用できます。
  2. リストを作成するには、右下隅に売る何かボタンをクリックします。
  3. タイトルのために、入力しXylophone
  4. 言い値するために、入力50
  5. アイテムの説明については、次のように入力します。 This high quality xylophone can be used to play music.
  6. ダウンロード木琴のこのイメージをコンピューターに、そしてあなたの項目ボタンの絵でそれをアップロードします。

画像をダウンロード

  1. あなたはすべてのフィールドに必要事項を記入し、画像をアップロードした後、ポストをクリックしてください。
  2. 新しいリストを見つけます。その詳細画面を見るためにあなたの項目をクリックし、販売者の連絡先情報パネルを展開します。
  3. Firebaseコンソールに戻ります。データベースのダッシュボードでは、あなたは今、あなたが下に掲載項目のエントリ表示されますforsaleノードを。ストレージダッシュボードでは、あなたはまた、あなたがアップロードした画像見つけるfriendlymarketパスを。

4.拡張機能を見つけてインストールします

問題

アプリのユーザー調査を行ったところ、ほとんどのユーザーがデスクトップではなくスマートフォンからサイトにアクセスしていることがわかりました。ただし、統計によると、モバイルユーザーは数秒後にサイトを離れる(「チャーン」)傾向があります。

不思議なことに、モバイル接続速度でサイトをテストします。 (それを行う方法を学び、ここ。)あなたは、画像をロードするために非常に長い時間がかかるし、すべてのブラウザにキャッシュされていないことがわかります。その長い読み込み時間は、すべてのページビューで発生します!

ソリューション

上に読んだ後に画像を最適化する方法は、画像の読み込み性能を向上させるために2つのステップを取ることにしました。

  • 画像を圧縮します。携帯電話でさえ、このアプリのニーズに必要な解像度よりもはるかに高い解像度で画像を撮影します。ファイルサイズを小さくすると、アプリの解像度が著しく低下することなく、読み込み時間が短縮されます。
  • キャッシング。デフォルトでは、Cloud Storageオブジェクトには、ブラウザに画像をキャッシュしないように指示するヘッダーがあります。つまり、ユーザーのブラウザは同じ画像を何度も再ダウンロードします。幸い、これらのヘッダーを変更してキャッシュを許可することができます。どちらのクライアント側のクラウドストレージSDKFirebase管理SDKは、あなたがこれらのヘッダを設定することができます。

画像を圧縮するには、アップロードの品質を制限するか、画像のサイズを変更するサーバー側のプロセスを用意する必要があります。トレードオフについて考えてみましょう。

  • クライアント側。クライアント側のプロセスでは、アップロードされた画像のファイルサイズを制限するだけで済みます。これは、新しいサーバーロジックを記述したり維持したりする必要がないことを意味します。ただし、これは、販売者が自分の画像のサイズを変更する方法を理解する必要があることも意味します。これは、新しいリストを作成する際の苦痛で直感的でない障壁です。
  • サーバー側。あなたがFirebaseのためのクラウド機能を使用する場合は、できる機能トリガ自動的にアップロード時に画像のサイズを変更します。つまり、売り手は好きなサイズの画像をアップロードでき(余分な作業は必要ありません)、バックエンド機能で画像のサイズをシームレスに変更できます。でもありますサンプルこの機能のために利用可能に!

サーバーサイドが進むべき道のようです。しかし、このアイデアはまだクローニング含まれたサンプルを、その次のセットアップ手順を、次にFirebase CLIで関数を展開します。画像のサイズ変更は、このような一般的な使用例のように聞こえます。もっと簡単な解決策はありませんか?

より簡単な解決策

あなたは運がいいです。より簡単な解決策があります:Firebase Extensions!のは、上で利用可能な拡張子のカタログをチェックしてみましょうFirebaseのウェブサイト

e6bc3874cf23f34f.png

それを見て! 「画像のサイズ変更」と呼ばれる拡張機能があります。それは有望に見えます。

この拡張機能をアプリで使用しましょう!

拡張機能をインストールする

  1. クリックして参照してください詳細をこの拡張機能に関する詳細情報を表示します。あなたが設定することができますどのようなもとで、拡張子は、あなたがにサイズを変更したい寸法を設定することができます、あなたもキャッシュヘッダーを設定することができます。完全!
  2. でのインストールコンソールのボタンをクリックして拡張機能の詳細ページ。すべてのプロジェクトを一覧表示するFirebaseコンソールページが表示されます。
  3. あなたはこのコードラボのために作成されたことをFriendlyMarketプロジェクトを選択してください。
  4. あなたが設定伸長工程に至るまで、画面の指示に従ってください。手順には、拡張機能の基本的な概要と、拡張機能が作成して必要な役割にアクセスするためのリソースが表示されます。
  5. **でCache-Controlリサイズ画像フィールドのヘッダ**、次のように入力します。

public, max-age=31536000

  1. 他のパラメータはデフォルト値のままにします。
  2. 拡張機能をインストール]をクリックします。

インストールが完了するのを待っている間...

Firebaseコマンドラインインターフェースを使用したインストール

コマンドラインツールに慣れている場合は、FirebaseCLIを使用して拡張機能をインストールおよび管理することもできます。ただ、使用firebase ext CLIの最新バージョンで利用可能なコマンドを、。より多くの情報を見つけることができるここに

(オプション)のCache-Controlヘッダ詳細については、こちらをご覧ください

Cache-Controlヘッダの値public, max-age=31536000画像は1年までのためにキャッシュされることを意味します。チェックアウトのCache-Controlヘッダーの詳細については、このマニュアルを参照して

クライアントコードを更新する

インストールした拡張機能は、サイズ変更された画像を元の画像と同じバケットに書き込みます。サイズ変更された画像には、ファイル名に追加された構成済みの寸法があります。元のファイルのパスがように見えたのであれば、 friendlymarket/user1234-car.png 、リサイズした画像のファイルパスは次のようになりますfriendlymarket/user1234-car_200x200.png

フルサイズの画像ではなく、サイズ変更された画像を取得するようにアプリを更新しましょう。

  1. StackBlitzでは、開くsrc/firebase-refs.jsファイルを。
  2. 既存の交換getImageRefリサイズ画像のための参考文献を作成するために、次のコードと機能:
export function getImageRef(storage, imagePath) {
  const xDimension = 200;
  const yDimension = 200;

  // find the '.' in 'file.jpg', 'file.png', etc
  const fileExtensionIndex = imagePath.lastIndexOf('.');

  const pathNameWithoutExtension = imagePath.substring(0, fileExtensionIndex);
  const dimensions = `${xDimension}x${yDimension}`;
  const fileExtension = imagePath.substring(fileExtensionIndex);

  return {
    resized: storage().ref(
      `${pathNameWithoutExtension}_${dimensions}${fileExtension}`
    ),
    original: storage().ref(imagePath)
  };
}

それをテストする

この拡張機能は新しい画像のアップロードを監視するため、既存の画像のサイズは変更されません。

新しい投稿を作成して、拡張機能の動作を確認します。

  1. ホーム画面に移動するには、あなたのアプリの上部のバーに優しい市場をクリックしてください。
  2. リストを作成するには、アプリの右下に売る何かボタンをクリックします。
  3. タイトルのために、入力したCoffee
  4. 言い値するために、入力します。 1
  5. 項目説明については、次のように入力します。 Selling one cafe latte. It has foam art in the shape of a bear
  6. ダウンロードコーヒーカップのこのイメージをコンピューターに、そしてあなたの項目ボタンの絵でそれをアップロードします。画像をダウンロード
  7. あなたはすべてのフィールドに必要事項を記入し、画像をアップロードした後、ポストをクリックしてください。木琴の下にコーヒーのリストが表示されます。
  8. では機能Firebaseコンソールのダッシュボード、[ログ]タブをクリックします。関数が実行されたことを示すログが表示されるはずです。

486d1226be84bb44.png

  1. 行くストレージにオリジナルコーヒー画像とリサイズしたバージョンの両方を確認するためにダッシュボードfriendlymarketパス。
  2. StackBlitzプレビューペインで、アプリのホーム画面を数回リロードします。コーヒーの画像が木琴の画像よりも大幅に速く読み込まれることに気付くはずです。

画像は小さいため、最初のページの読み込み時の読み込みが速くなり、後続のページの更新時に、ネットワークリクエストをトリガーする代わりに、ブラウザのキャッシュから画像が読み込まれます。

5.拡張機能を再構成します

問題

アプリは、販売者のリストのドラフトバージョンを自動保存します。あなたのユーザーはこの機能が好きですが、あなたの統計は少し心配です。あなたのレポートによると、実際に投稿されているのはドラフトの約10%のみで、残りの90%はデータベースのスペースを占有しているだけです。

ソリューション

封筒裏の計算を行った後、一度に保存する必要があるのは約5つのドラフトだけであることがわかりました。

Firebase Extensionsのカタログを覚えていますか?たぶん、この状況のた​​めにすでに構築されたソリューションがあります。インストールレッツ・リミット子ノードを自動的に5つ以下で保存されたドラフトの数を維持するための拡張を。拡張機能は、新しいドラフトが追加されるたびに最も古いドラフトを削除します。

  1. 上の[インストール]ボタンをクリックして拡張機能の詳細ページ
  2. マーケットプレイスウェブアプリに使用しているFirebaseプロジェクトを選択します。
  3. あなたが設定伸長工程に至るまで、画面の指示に従ってください。
  4. リアルタイムのデータベース・パスの場合は、入力drafts 。これは、下書きが保存されるデータベース内のパスです。
  5. 保つために、ノードの最大数については、入力5 。これは、各アイテムのリストに5つのドラフトが保存され、別のドラフトが追加されると、最も古いドラフトが自動的に削除されることを意味します。
  6. 拡張機能をインストール]をクリックします。

インストールが完了するのを待っている間...

拡張機能の監視

拡張機能をインストールすると、プロセスによっていくつかの関数が作成されます。これらの関数が実行されている頻度を確認したり、ログとエラー率を表示したりすることができます。あなたの拡張機能を監視する方法の詳細については、を参照してくださいインストールされた拡張機能を管理します。ドキュメントの指示に従って、前の手順で[画像のサイズ変更]拡張機能によって作成された関数を表示します。

拡張機能のアンインストール

プロジェクトから拡張機能を削除するために、拡張機能が作成する個々の関数を削除したくなるかもしれませんが、1つの拡張機能が複数の関数を作成する可能性があるため、予期しない動作が発生する可能性があります。する方法を学ぶ拡張アンインストールドキュメントのを。

アンインストールすると、すべてのリソース(拡張機能の関数など)と、拡張機能のそのインスタンス用に作成されたサービスアカウントが削除されます。ただし、拡張機能によって作成されたアーティファクト(サイズ変更された画像など)は、拡張機能をアンインストールした後もプロジェクトに残ります。

1つのプロジェクトに拡張機能の複数のコピーをインストールする

プロジェクトに特定の拡張機能の単一インスタンスをインストールすることに限定されません。別のパスのエントリを制限したい場合は、この拡張機能の別のインスタンスをインストールできます。ただし、このコードラボでは、拡張機能を1回だけインストールします。

実際に見てください

  1. 木琴やラテの投稿に使用したアカウントでログインしていることを確認してください
  2. いくつかの下書きを生成します。
  3. アプリの右下隅に売る何かボタンをクリックします
  4. 編集「1案」と言うためにタイトル
  5. 下書きのセクションまでスクロールして、ドラフトの数を表示します。少なくとも2つあるはずです。
  6. トップアプリバーにFRIENDLY MARKET]ボタンをクリックします。このようにして、下書きを保存できますが、投稿する必要はありません。
  7. 「ドラフト2」、「ドラフト3」などについて、「ドラフト6」まで繰り返します。
  8. あなたは「ドラフト6」、「下書きのセクションからの1が消滅ドラフトという通知を作成するとき。
  9. [画像のサイズ変更]拡張機能で行ったように、関数ログをチェックして、どの関数がトリガーされたかを確認できます。

おっと、保持するドラフトの制限が小さすぎます

あなたのカスタマーサポートチームが連絡を取り、あなたの最も多作な売り手の何人かが彼らがそれらを投稿する前に彼らの下書きが削除されていると不平を言っていることをあなたに知らせます。チームメイトと一緒に数学をチェックすると、数学が10,000倍ずれていることに気づきます。

どうすればこれを修正できますか?インストールされている拡張機能を再構成しましょう!

  1. Firebaseコンソールの左ペインで、拡張]クリックします。
  2. インストールされた拡張機能のカードで、[管理]をクリックします。
  3. 右上隅には、再設定の拡張機能をクリックしてください。
  4. 保つために、ノードの変更の最大数50000
  5. [保存]クリックします。

そして、それはあなたがする必要があるすべてです!拡張機能の更新にかかる時間内に、サポートチームに相談して、修正がすでに展開されていることをサポートチームに知らせることができます。

6.ユーザーデータを自動的に削除します

問題

カスタマーサポートチームから再度連絡がありました。アカウントを削除した販売者は、まだ他のユーザーからメールを受け取っており、怒っています。これらの販売者は、アカウントを削除したときにメールアドレスがシステムから削除されることを期待していました。

今のところ、サポートは各ユーザーのデータを手動で削除していますが、もっと良い方法が必要です!あなたはそれについて考え、定期的に実行され、削除されたアカウントから電子メールアドレスをクリアする独自のバッチジョブを作成することを検討します。しかし、ユーザーデータの削除はかなり一般的な問題のようです。たぶん、FirebaseExtensionsもこの問題の解決に役立つでしょう。

ソリューション

あなたは、設定します削除ユーザーデータの自動削除するように拡張しusers/uid 、ユーザーが自分のアカウントを削除し、データベース内のノードを。

  1. 上の[インストール]ボタンをクリックして拡張機能の詳細ページ
  2. マーケットプレイスウェブアプリに使用しているFirebaseプロジェクトを選択します。
  3. あなたが設定伸長工程に至るまで、画面の指示に従ってください。
  4. リアルタイムデータベースパスのために、入力sellers/{UID} sellers部分は、その子供ユーザの電子メールアドレスを含むノードであり、 {UID}ワイルドカードです。この構成では、拡張子が1234年のUIDを持つユーザーが自分のアカウントを削除したときに、拡張子が削除すべきであることを知っているだろうsellers/1234データベースから。
  5. 拡張機能をインストール]をクリックします。

インストールが完了するのを待っている間...

カスタマイズ性について話しましょう

このコードラボでは、Firebase Extensionsが一般的なユースケースの解決に役立つこと、および拡張機能がアプリのニーズに合わせて構成可能であることを確認しました。

ただし、拡張機能ですべての問題を解決できるわけではなく、ユーザーデータの削除の問題はその良い例です。 Delete User Data拡張機能は、ユーザーがアカウントを削除した後も電子メールが引き続き公開されるという現在の苦情に対処しますが、拡張機能がすべてを削除するわけではありません。たとえば、アイテムリストは引き続き利用可能であり、CloudStorage内の画像も残ります。ユーザーデータの削除拡張機能を使用すると、削除するクラウドストレージパスを構成できますが、ユーザーはさまざまな名前のさまざまなファイルをアップロードできるため、これらのアーティファクトを自動的に削除するようにこの拡張機能を構成することはできません。このような状況では、 Firebaseのためのクラウド機能は、アプリのデータモデルに固有のコードを書くことができるように、より良いフィットかもしれません。

拡張機能と請求

Firebase拡張機能自体は無料で使用できますが(使用する基盤となるリソースに対してのみ課金されます)、拡張機能に必要な基盤となるリソースの一部には課金が必要になる場合があります。このコードラボは、請求先アカウントなしで完了するように設計されています。ただし、FlameまたはBlazeプランを設定すると、非常に興味深いFirebase拡張機能のロックが解除されます。

たとえば、次のことが可能なURL短縮トリガ電子メールBigQueryのへの輸出のコレクション、そしてより多くを!拡張子の完全なカタログをチェックしてくださいここに

必要な拡張機能がありますが、現在利用できない場合は、ぜひお知らせください。機能要求を提出Firebaseサポートの新しい拡張を提案します。

実際に見てください

拡張機能のインストールが完了したら、ユーザーを削除して、何が起こるかを確認します。

  1. Firebaseコンソールでは、あなたの頭の上のリアルタイムデータベースのダッシュボード
  2. 展開sellersノードを。
  3. 各販売者の情報は、ユーザーUIDに基づいています。ユーザーのUIDを選択します。
  4. Firebaseコンソールでは、あなたの頭の上の認証のダッシュボード、およびそのユーザーのUIDを見つけます。
  5. UIDの右側にあるメニューを展開し、[削除]アカウントを選択します。

2e03923c9d7f1f29.png

  1. あなたのリアルタイムデータベースのダッシュボードに戻ります。売り手の情報はなくなります!

7.おめでとうございます!

このコードラボではあまりコードを記述していませんが、マーケットプレイスアプリに重要な機能を追加しました。

拡張機能を検出、構成、インストール、および再構成する方法を学習しました。さらに、インストールされている拡張機能を監視する方法と、必要に応じてそれらをアンインストールする方法についても学びました。

次は何ですか?

これらの他の拡張機能のいくつかをチェックしてください:

より多くのカスタムサーバー側コードが必要ですか?

その他の役立つドキュメント

拡張機能の管理:

拡張機能に関する詳細を学ぶ: