Adicione novas funcionalidades ao seu app da Web rapidamente com as Extensões do Firebase

1. Introdução

Metas

Neste codelab, você vai adicionar funcionalidades a um app de marketplace on-line com a ajuda das Extensões do Firebase. Neste codelab, você vai entender como as extensões podem ajudar você a gastar menos tempo com tarefas de desenvolvimento e gerenciamento de apps.

3b6977f679c67db.png

O que você vai criar

Neste codelab, você vai adicionar os seguintes recursos a um app da Web de marketplace on-line:

  • Carregar imagens mais rapidamente para aumentar a retenção de usuários
  • Limitar as entradas no banco de dados para melhorar o desempenho e reduzir a conta
  • Implementar a exclusão automática de dados antigos do usuário para melhorar a proteção dos dados do usuário

O que você aprenderá

  • Como descobrir extensões para casos de uso comuns
  • Como instalar e configurar uma extensão no seu projeto
  • Como manter (monitorar, atualizar e desinstalar) extensões no seu projeto

Este codelab é focado nas extensões do Firebase. Para informações detalhadas sobre outros produtos do Firebase mencionados neste codelab, consulte a documentação do Firebase e outros codelabs.

Pré-requisitos

  • Um computador com um navegador da Web moderno instalado (recomendamos o Chrome)
  • Uma Conta do Google

2. Criar e configurar um projeto do Firebase

Criar um projeto do Firebase

  1. No Console do Firebase, clique em Adicionar projeto e nomeie o projeto como FriendlyMarket.
  2. Clique nas opções de criação do projeto. Aceite os termos do Firebase. Ignore a configuração do Google Analytics, porque ele não vai ser usado.
  3. Aguarde o provisionamento do projeto e clique em Continuar.

O aplicativo que você vai criar usa alguns produtos do Firebase disponíveis para apps da Web:

  • Firebase Authentication: usado para identificar seus usuários com facilidade.
  • Firebase Realtime Database: usado para salvar dados estruturados na nuvem e receber notificações instantâneas quando os dados são atualizados.
  • Cloud Storage para Firebase, para salvar imagens na nuvem

Agora, você vai ativar e configurar esses produtos do Firebase usando o console do Firebase.

Fazer upgrade do plano de preços do Firebase

Para usar as Extensões do Firebase e os serviços de nuvem associados, além do Cloud Storage para Firebase, seu projeto do Firebase precisa estar no plano de preços pague conforme o uso (Blaze), ou seja, vinculado a uma conta do Cloud Billing.

  • Uma conta do Cloud Billing exige uma forma de pagamento, como cartão de crédito.
  • Se você ainda não conhece o Firebase e o Google Cloud, confira se tem qualificação para receber um crédito de US$300 e uma conta de teste sem custo financeiro do Cloud Billing.
  • Se você estiver fazendo este codelab como parte de um evento, pergunte ao organizador se há créditos do Cloud disponíveis.

Para fazer upgrade do seu projeto para o plano Blaze, siga estas etapas:

  1. No console do Firebase, selecione Fazer upgrade do seu plano.
  2. Selecione o plano Blaze. Siga as instruções na tela para vincular uma conta do Cloud Billing ao seu projeto.
    Se você precisou criar uma conta do Cloud Billing como parte desse upgrade, talvez seja necessário voltar ao fluxo de upgrade no console do Firebase para concluir o upgrade.

Ativar o login por e-mail

Embora a autenticação não seja o foco deste codelab, é importante ter uma forma desse processo no seu app para identificar de forma exclusiva todos que o usam. Você vai usar o login por e-mail.

  1. No Console do Firebase, clique em Desenvolver no painel à esquerda.
  2. Clique em Autenticação e na guia Método de login. Clique aqui para acessar a guia Método de login.
  3. Clique em E-mail/senha na lista Provedores de login, ative a chave Ativar e clique em Salvar.

ed0f449a872f7287.png

Ativar o Realtime Database

O app usa o Firebase Realtime Database para salvar itens à venda.

  1. No painel à esquerda do Console do Firebase, expanda Build e selecione Realtime Database.
  2. Clique em Criar banco de dados.
  3. Selecione um local para o banco de dados e clique em Próxima.
    No caso de apps reais, escolha um local próximo aos usuários.
  4. Clique em Iniciar no modo de teste. Leia a exoneração de responsabilidade sobre as regras de segurança.
    Nas próximas etapas deste codelab, você vai adicionar regras de segurança para proteger seus dados. Não distribua ou exponha um aplicativo publicamente sem adicionar regras de segurança ao seu banco de dados.
  5. Clique em Criar.

Definir regras de segurança para seu banco de dados

Agora, você vai definir as regras de segurança necessárias para esse app. Confira alguns exemplos de regras básicas para ajudar a proteger seu app. Essas regras permitem que qualquer pessoa visualize os itens à venda, mas apenas os usuários conectados podem realizar outras leituras e gravações. Não se preocupe com os detalhes dessas regras. Você só vai copiar e colar para colocar o app em funcionamento.

  1. Na parte de cima do painel do Realtime Database, clique na guia Regras.

e233a24a38b37e95.png

  1. Copie e cole o seguinte conjunto de regras no campo de regras na guia Regras:
    {
      "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"
          }
      }
    }
    
  2. Clique em Publicar.

Configurar o Cloud Storage para Firebase

O app usa o Cloud Storage para Firebase para salvar imagens de itens à venda.

Confira como configurar o Cloud Storage para Firebase no seu projeto do Firebase:

  1. No painel à esquerda do Console do Firebase, expanda Build e selecione Armazenamento.
  2. Clique em Começar.
  3. Selecione um local para o bucket do Storage padrão.
    Os buckets em US-WEST1, US-CENTRAL1 e US-EAST1 podem aproveitar o nível "Sempre sem custo financeiro" do Google Cloud Storage. Os buckets em todos os outros locais seguem os preços e o uso do Google Cloud Storage.
  4. Clique em Iniciar no modo de teste. Leia a exoneração de responsabilidade sobre as regras de segurança.
    Nas próximas etapas deste codelab, você vai adicionar regras de segurança para proteger seus dados. Não distribua ou exponha um aplicativo publicamente sem adicionar regras de segurança ao bucket do Storage.
  5. Clique em Criar.

Configurar regras de segurança para seu bucket do Storage

Agora, você vai definir as regras de segurança necessárias para esse app. Essas regras permitem que apenas usuários autenticados postem novas imagens, mas permitem que qualquer pessoa visualize a imagem de um item listado.

  1. Na parte de cima do painel Armazenamento, clique na guia Regras.

e7003646b429500b.png

  1. Copie e cole o seguinte conjunto de regras no campo de regras na guia Regras:
    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;
        }
    
      }
    }
    
  2. Clique em Publicar.

3. Executar o app de amostra

Criar um fork do projeto StackBlitz

Neste codelab, você vai criar e implantar um app usando o StackBlitz, um editor on-line que tem vários fluxos de trabalho do Firebase integrados. O Stackblitz não exige instalação de software nem conta especial.

O StackBlitz permite compartilhar projetos com outras pessoas. Outras pessoas que têm o URL do seu projeto StackBlitz podem acessar seu código e fazer um fork do seu projeto, mas não podem editar o projeto StackBlitz.

  1. Acesse este URL para conferir o código inicial: https://stackblitz.com/edit/friendlymarket-codelab.
  2. Na parte de cima da página do StackBlitz, clique em Fork.

22c44cf92ed26208.png

Agora você tem uma cópia do código inicial como seu próprio projeto StackBlitz. Como você não fez login, sua "conta" se chama @anonymous, mas tudo bem. O projeto tem um nome e um URL exclusivos. Todos os seus arquivos e mudanças são salvos neste projeto do StackBlitz.

Adicionar um app da Web do Firebase ao projeto

  1. No StackBlitz, confira o arquivo src/firebase-config.js. É aqui que você vai adicionar o objeto de configuração do Firebase.
  2. No Console do Firebase, navegue até a página de visão geral do projeto clicando em Visão geral do projeto no canto superior esquerdo.
  3. No centro da página de visão geral do projeto, clique no ícone da Web 58d6543a156e56f9.png para criar um novo app da Web do Firebase. 88c964177c2bccea.png
  4. Registre o app com o apelido FriendlyMarket Codelab.
  5. Para este codelab, não marque a caixa ao lado de Também configurar o Firebase Hosting para este app. Em vez disso, você vai usar o painel de visualização do StackBlitz.
  6. Clique em Registrar app.
  7. Copie o objeto de configuração do Firebase do seu app para a área de transferência. Não copie as tags <script>. Observação: se você precisar encontrar a configuração mais tarde, siga estas instruções.

6c0519e8f48a3a6f.png

  1. Clique em Continuar para o Console.

Adicione a configuração do projeto ao app:

  1. De volta ao StackBlitz, acesse o arquivo src/firebase-config.js.
  2. Cole o snippet de configuração no arquivo. Depois disso, a configuração vai ficar assim, mas com os valores do seu projeto no objeto de configuração:

177602cbe84f873d.png

Qual é o ponto de partida deste app?

Confira a visualização interativa no lado direito da tela do StackBlitz:

f3ec800f27fa49b7.png

Este codelab começa com o código de um app básico de marketplace. Qualquer usuário pode conferir uma lista de itens à venda e clicar em um link para acessar a página de detalhes de um item. Se um usuário estiver conectado, ele vai ter acesso aos dados de contato do vendedor para negociar um preço e comprar o item.

Teste o app:

  1. Faça login com o botão na parte de cima da tela inicial. Você pode usar um endereço de e-mail, nome e senha falsos.
  2. Clique no botão Vender algo no canto inferior direito para criar um anúncio.
  3. Em Título, digite Xylophone.
  4. Em Preço de venda, insira 50.
  5. Em Descrição do item, insira o seguinte: This high quality xylophone can be used to play music.
  6. Faça o download desta imagem de um xilofone no seu computador e faça o upload dela com o botão PICTURE OF YOUR ITEM.

  1. Depois de preencher todos os campos e fazer o upload de uma imagem, clique em Postar.
  2. Encontre sua nova ficha. Clique no item para abrir a tela de detalhes e abra o painel Dados de contato do vendedor.
  3. Volte para o Console do Firebase. No painel Database, você vai encontrar uma entrada para o item que postou no nó forsale. No painel Armazenamento, você também encontra a imagem que enviou no caminho friendlymarket.

4. Encontrar e instalar uma extensão

O problema

Depois de fazer uma pesquisa de usuários para seu app, você descobre que a maioria dos usuários acessa seu site pelo smartphone, não pelo computador. No entanto, suas estatísticas também mostram que os usuários de dispositivos móveis tendem a sair do seu site ("churn") após apenas alguns segundos.

Por curiosidade, você testa seu site com velocidades de conexão de dispositivos móveis. Saiba como fazer isso. Você descobre que as imagens demoram muito para carregar e não são armazenadas em cache no navegador. Esse tempo de carregamento longo é gerado em cada visualização de página.

Solução

Depois de ler sobre como otimizar imagens, você decide seguir duas etapas para melhorar o desempenho de carregamento de imagens:

  • Compacte as imagens. Mesmo os smartphones tiram imagens com resolução muito maior do que o necessário para as necessidades do app. Reduzir o tamanho do arquivo acelera os tempos de carregamento sem uma queda perceptível na resolução do app.
  • Armazenamento em cache. Por padrão, os objetos do Cloud Storage têm cabeçalhos que informam aos navegadores para não armazenar imagens em cache, o que significa que o navegador de um usuário vai fazer o download da mesma imagem várias vezes. Felizmente, é possível mudar esses cabeçalhos para permitir o armazenamento em cache. O SDK do Cloud Storage do lado do cliente e o SDK Admin do Firebase permitem definir esses cabeçalhos.

Para compactar imagens, você precisa limitar a qualidade do upload ou ter um processo no servidor que redimensione as imagens. Vamos considerar os prós e contras:

  • Lado do cliente. Para um processo do lado do cliente, você pode limitar o tamanho do arquivo das imagens enviadas. Isso significa que você não precisa escrever nem manter nenhuma nova lógica do servidor. No entanto, isso também significa que os vendedores precisam descobrir como redimensionar as próprias imagens, o que é uma barreira difícil e não intuitiva para criar um novo anúncio.
  • Do lado do servidor. Se você usa o Cloud Functions para Firebase, pode acionar uma função que redimensiona automaticamente uma imagem ao fazer o upload dela. Isso significa que os vendedores podem fazer upload de imagens de qualquer tamanho (sem trabalho extra para eles) e sua função de back-end pode redimensionar a imagem sem problemas. Há até um exemplo disponível para essa função.

Parece que o lado do servidor é a melhor opção. Mas essa ideia ainda envolve clonar o exemplo, seguindo as instruções de configuração e implantando a função com a CLI do Firebase. Redimensionar imagens parece um caso de uso comum. Não há uma solução mais fácil?

Uma solução mais fácil

Você está com sorte. Há uma solução mais fácil: as Extensões do Firebase. Vamos conferir o catálogo de extensões disponíveis no site do Firebase.

e6bc3874cf23f34f.png

Olha só isso. Há uma extensão chamada "Redimensionar imagens". Parece promissor.

Vamos usar essa extensão no seu app.

Instalar uma extensão

  1. Clique em Ver detalhes para mais informações sobre essa extensão. Em O que pode ser configurado, a extensão permite definir as dimensões que você quer redimensionar e até mesmo definir o cabeçalho do cache. Perfeito!
  2. Clique no botão Install in console na página de detalhes da extensão. Você vai ser direcionado para uma página do console do Firebase que lista todos os seus projetos.
  3. Escolha o projeto FriendlyMarket que você criou para este codelab.
  4. Siga as instruções na tela até chegar à etapa Configurar a extensão. As instruções mostram um resumo básico da extensão, além dos recursos que ela vai criar e dos papéis de acesso necessários.
  5. No campo **Cache-Control** header for resized images, insira o seguinte:

public, max-age=31536000

  1. Deixe os outros parâmetros com os valores padrão.
  2. Clique em Instalar extensão.

Enquanto você espera a instalação ser concluída...

Como instalar com a interface de linha de comando do Firebase

Se você se sentir mais confortável com ferramentas de linha de comando, as extensões também podem ser instaladas e gerenciadas usando a CLI do Firebase. Basta usar o comando firebase ext, disponível na versão mais recente da CLI. Confira mais informações aqui.

(Opcional) Saiba mais sobre os cabeçalhos Cache-Control

O valor do cabeçalho Cache-Control public, max-age=31536000 significa que a imagem será armazenada em cache por até um ano. Para saber mais sobre o cabeçalho Cache-Control, consulte esta documentação.

Atualizar o código do cliente

A extensão instalada grava uma imagem redimensionada no mesmo bucket da imagem original. A imagem redimensionada tem as dimensões configuradas anexadas ao nome do arquivo. Portanto, se o caminho do arquivo original for friendlymarket/user1234-car.png, o caminho do arquivo da imagem redimensionada será friendlymarket/user1234-car_200x200.png.

Vamos atualizar o app para que ele busque as imagens redimensionadas em vez das imagens de tamanho completo.

  1. No StackBlitz, abra o arquivo src/firebase-refs.js.
  2. Substitua a função getImageRef atual pelo seguinte código para criar uma referência para a imagem redimensionada:
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)
  };
}

Testar

Como essa extensão monitora novos uploads de imagens, a imagem atual não será redimensionada.

Crie uma nova postagem para conferir a extensão em ação:

  1. Clique em Friendly Market na barra de cima do app para acessar a tela inicial.
  2. Clique no botão Vender algo no canto inferior direito do app para criar uma listagem.
  3. Em Título, digite Coffee
  4. Em Preço de venda, insira 1.
  5. Em Descrição do item, insira o seguinte: Selling one cafe latte. It has foam art in the shape of a bear.
  6. Faça o download desta imagem de uma xícara de café no seu computador e faça o upload dela com o botão PICTURE OF YOUR ITEM.
  7. Depois de preencher todos os campos e fazer o upload de uma imagem, clique em Postar. A lista de cafés vai aparecer abaixo do xilofone.
  8. No painel Funções do Console do Firebase, clique na guia Registros. Você vai encontrar registros da função que mostram que ela foi executada.

486d1226be84bb44.png

  1. Acesse o painel Armazenamento para conferir a imagem original do café e uma versão redimensionada no caminho friendlymarket.
  2. No painel de visualização do StackBlitz, recarregue a tela inicial do app algumas vezes. A imagem do café vai carregar muito mais rápido do que a imagem do xilofone.

A imagem é carregada mais rápido no primeiro carregamento da página porque é menor e, nas atualizações subsequentes, é carregada do cache do navegador em vez de acionar uma solicitação de rede.

5. Reconfigurar uma extensão

O problema

O app salva automaticamente versões de rascunho da página de detalhes de um vendedor. Os usuários gostam desse recurso, mas suas estatísticas são um pouco preocupantes. Seus relatórios mostram que apenas cerca de 10% dos rascunhos são publicados, e os outros 90% estão apenas ocupando espaço no seu banco de dados.

Solução

Depois de alguns cálculos rápidos, você percebe que só precisa salvar cerca de cinco rascunhos por vez.

Lembra do catálogo de Extensões do Firebase? Talvez já exista uma solução para essa situação. Vamos instalar a extensão Limit Child Nodes para manter automaticamente o número de rascunhos salvos em cinco ou menos. A extensão vai excluir o rascunho mais antigo sempre que um novo for adicionado.

  1. Clique no botão Instalar na página de detalhes da extensão.
  2. Escolha o projeto do Firebase que você está usando para o app da Web do marketplace.
  3. Siga as instruções na tela até chegar à etapa Configurar a extensão.
  4. Em Caminho do Realtime Database, insira drafts. Este é o caminho no banco de dados em que os rascunhos são salvos.
  5. Em Contagem máxima de nós armazenados, insira 5. Isso significa que cinco rascunhos para cada item da listagem serão salvos. Se outro for adicionado, o rascunho mais antigo será excluído automaticamente.
  6. Clique em Instalar extensão.

Enquanto você espera a instalação ser concluída

Extensões de monitoramento

Quando você instala uma extensão, o processo cria várias funções. Você pode verificar a frequência com que essas funções estão sendo executadas ou conferir os registros e as taxas de erro. Para saber como monitorar sua extensão, consulte Gerenciar extensões instaladas. Siga as instruções na documentação para conferir as funções criadas pela extensão "Redimensionar imagens" na etapa anterior.

Desinstalar extensões

Para remover uma extensão do projeto, você pode querer excluir as funções individuais que ela cria, mas isso pode levar a um comportamento inesperado, já que uma extensão pode criar várias funções. Saiba como desinstalar uma extensão na documentação.

A desinstalação exclui todos os recursos (como funções da extensão) e a conta de serviço criada para essa instância da extensão. No entanto, todos os artefatos criados pela extensão (como as imagens redimensionadas) vão permanecer no seu projeto após a desinstalação da extensão.

Como instalar várias cópias de uma extensão em um único projeto

Você não precisa instalar apenas uma instância de uma determinada extensão em um projeto. Se você quiser limitar as entradas em outro caminho, instale outra instância dessa extensão. No entanto, para este codelab, você vai instalar a extensão apenas uma vez.

Veja isso na prática

  1. Verifique se você fez login com a conta que usou para postar o xilofone ou o latte
  2. Crie alguns rascunhos:
  3. Clique no botão Vender algo no canto inferior direito do app.
  4. Edite o Título para "Rascunho 1".
  5. Role a tela para baixo até a seção Rascunhos e confira o número de rascunhos. Precisam ser pelo menos dois.
  6. Clique no botão FRIENDLY MARKET na barra de apps na parte de cima. Assim, você terá um rascunho salvo, mas não precisará publicá-lo.
  7. Repita para "Rascunho 2", "Rascunho 3" e assim por diante até "Rascunho 6".
  8. Quando você cria o "Rascunho 6", o "Rascunho 1" desaparece da seção Rascunhos.
  9. Assim como você fez com a extensão "Redimensionar imagens", é possível verificar os registros de funções para saber quais funções foram acionadas.

Ops, o limite de rascunhos a serem mantidos é muito pequeno

A equipe de suporte ao cliente entra em contato para informar que alguns dos seus vendedores mais produtivos estão reclamando que os rascunhos deles estão sendo excluídos antes de serem publicados. Você confere seus cálculos com seu colega de equipe e percebe que errou por um fator de 10.000.

Como você pode corrigir isso? Vamos reconfigurar a extensão instalada.

  1. No painel esquerdo do Console do Firebase, clique em Extensões.
  2. No card da extensão instalada, clique em Gerenciar.
  3. No canto superior direito, clique em Reconfigurar extensão.
  4. Mude Contagem máxima de nós armazenados para 50000.
  5. Clique em Salvar.

E isso é tudo que você precisa fazer. Enquanto a extensão é atualizada, você pode conversar com a equipe de suporte e informar que uma correção já está sendo implantada.

6. Excluir dados do usuário automaticamente

O problema

Nossa equipe de suporte ao cliente entrou em contato com você novamente. Os vendedores que excluíram as contas ainda estão recebendo e-mails de outros usuários e estão irritados. Esses vendedores esperavam que os endereços de e-mail fossem excluídos dos seus sistemas quando eles excluíssem as contas.

Por enquanto, o suporte está excluindo manualmente os dados de cada usuário, mas precisa haver uma maneira melhor. Você pensa nisso e considera escrever seu próprio job em lote, que é executado periodicamente e exclui os endereços de e-mail das contas excluídas. No entanto, a exclusão de dados do usuário parece ser um problema bastante comum. Talvez as extensões do Firebase também possam ajudar a resolver esse problema.

Solução

Você vai configurar a extensão Excluir dados do usuário para excluir automaticamente o nó users/uid no banco de dados quando um usuário excluir a conta.

  1. Clique no botão Instalar na página de detalhes da extensão.
  2. Escolha o projeto do Firebase que você está usando para o app da Web do marketplace.
  3. Siga as instruções na tela até chegar à etapa Configurar a extensão.
  4. Para Caminhos do Realtime Database, insira sellers/{UID}. A parte sellers é o nó cujos filhos contêm endereços de e-mail do usuário, e {UID} é um curinga. Com essa configuração, a extensão vai saber que, quando o usuário com o UID 1234 excluir a conta, a extensão precisa excluir sellers/1234 do banco de dados.
  5. Clique em Instalar extensão.

Enquanto você espera a instalação ser concluída

Vamos falar sobre a personalização

Neste codelab, você aprendeu que as Extensões do Firebase podem ajudar a resolver casos de uso comuns e que elas são configuráveis para atender às necessidades do seu app.

No entanto, as extensões não podem resolver todos os problemas, e a exclusão de dados do usuário é um bom exemplo disso. Embora a extensão "Excluir dados do usuário" resolva a reclamação atual de que os e-mails ainda estão expostos depois que um usuário exclui a conta, ela não exclui tudo. Por exemplo, a listagem do item ainda está disponível, e as imagens no Cloud Storage também vão permanecer. A extensão "Excluir dados do usuário" permite configurar um caminho do Cloud Storage para exclusão, mas, como os usuários podem fazer upload de muitos arquivos diferentes com muitos nomes diferentes, não é possível configurar essa extensão para excluir esses artefatos automaticamente. Para situações como essa, o Cloud Functions para Firebase pode ser uma opção melhor para que você possa escrever um código específico para o modelo de dados do seu app.

Extensões e faturamento

As Extensões do Firebase não têm custo de uso (você só paga pelos recursos subjacentes que usa), mas alguns deles podem exigir faturamento. Este codelab foi projetado para ser concluído sem uma conta de faturamento. No entanto, a configuração de um plano Flame ou Blaze desbloqueia muitas extensões do Firebase muito interessantes.

Por exemplo, você pode encurtar URLs, acionar e-mails, exportar coleções para o BigQuery e muito mais. Confira o catálogo completo de extensões aqui.

Se você quiser uma extensão que ainda não está disponível, conte para a gente. Faça uma solicitação de recurso com o suporte do Firebase para sugerir uma nova extensão.

Veja isso na prática

Depois que a instalação da extensão for concluída, exclua um usuário e veja o que acontece:

  1. No Console do Firebase, acesse o painel do Realtime Database.
  2. Expanda o nó sellers.
  3. As informações de cada vendedor são codificadas com o UID do usuário. Escolha o UID de um usuário.
  4. No console do Firebase, acesse o painel de Autenticação e encontre o UID do usuário.
  5. Abra o menu à direita do UID e selecione Excluir conta.

2e03923c9d7f1f29.png

  1. Volte para o painel do Realtime Database. As informações do vendedor serão excluídas.

7. Parabéns!

Embora você não tenha escrito muito código neste codelab, você adicionou recursos importantes ao app do marketplace.

Você aprendeu a descobrir, configurar, instalar e reconfigurar extensões. Além disso, você aprendeu a monitorar as extensões instaladas e a desinstalá-las, se necessário.

Qual é a próxima etapa?

Confira algumas outras extensões:

Precisa de mais código personalizado do lado do servidor?

Outros documentos úteis

Como gerenciar extensões:

Aprenda mais sobre as extensões: