Usar os SDKs do Flutter gerados

Com os SDKs do cliente do Firebase Data Connect, é possível chamar suas consultas e mutações do lado do servidor diretamente de um app do Firebase. Gere um SDK do cliente personalizado em paralelo ao projetar os esquemas, as consultas e as mutações implantadas no serviço Data Connect. Em seguida, integre os métodos desse SDK à lógica do cliente.

Como já mencionamos, é importante observar que as consultas e mutações Data Connect não são enviadas pelo código do cliente e executadas no servidor. Em vez disso, quando implantadas, as operações Data Connect são armazenadas no servidor, como o Cloud Functions. Isso significa que você precisa implantar as mudanças correspondentes do lado do cliente para evitar problemas com usuários existentes (por exemplo, em versões mais antigas do app).

Por isso, o Data Connect oferece um ambiente de desenvolvimento e ferramentas que permitem criar protótipos de esquemas, consultas e mutações implantados no servidor. Ele também gera SDKs do lado do cliente automaticamente enquanto você cria o protótipo.

Depois de iterar as atualizações dos aplicativos de serviço e cliente, as atualizações do servidor e do cliente estarão prontas para implantação.

Gerar o SDK do Flutter

Como na maioria dos projetos do Firebase, o trabalho no código do cliente Firebase Data Connect acontece em um diretório de projeto local. A extensão do Data Connect para VS Code e a CLI Firebase são ferramentas locais importantes para gerar e gerenciar o código do cliente.

As opções de geração do SDK são vinculadas a várias entradas no arquivo dataconnect.yaml gerado quando você inicializou o projeto.

Inicializar a geração do SDK

connectorId: movies
generate:
  dartSdk:
    outputDir: ../../lib/generated # Feel free to change this to a different path
    package: movies

outputDir especifica onde o SDK gerado vai ser gerado. Esse caminho é relativo ao diretório que contém o próprio arquivo connector.yaml. Como opção, você pode fornecer um caminho absoluto para o outputDir.

package especifica o nome do pacote.

Atualizar SDKs durante a prototipagem

Se você estiver criando protótipos de forma interativa com a extensão do Data Connect para o VS Code e o emulador Data Connect, os arquivos de origem do SDK serão gerados e atualizados automaticamente enquanto você modifica arquivos .gql que definem esquemas, consultas e mutações. Esse pode ser um recurso útil em fluxos de trabalho de (re)carregamento em tempo real.

Como alternativa, use a CLI para regenerar SDKs sempre que os arquivos .gql forem alterados:

firebase dataconnect:sdk:generate --watch

Gerar SDKs para versões de integração e produção

Em alguns casos, como ao preparar fontes de projeto para envio para testes de CI, é possível chamar a CLI Firebase para uma atualização em lote.

Nesses casos, use firebase dataconnect:sdk:generate.

Configurar o código do cliente

Inicializar o app Data Connect

Primeiro, inicialize o app usando as instruções padrão de configuração do Firebase.

Em seguida, instale o plug-in Data Connect:

flutter pub add firebase_data_connect

Inicializar o SDK do Flutter Data Connect

Inicializar a instância do Data Connect usando as informações que você usou para configurar o Data Connect (todas disponíveis na guia "Data Connect" do console do Firebase).

Importar bibliotecas

Há dois conjuntos de importações necessários para inicializar o código do cliente: importações Data Connect gerais e importações específicas do SDK geradas.

// general imports
import 'package:firebase_data_connect/firebase_data_connect.dart';

// generated queries and mutations from SDK
import 'generated/movies.dart';

Criar protótipos e testar seus apps do Flutter

Instrumentar clientes para usar um emulador local

É possível usar o emulador Data Connect, seja da extensão Data Connect VS Code ou da CLI.

A instrumentação do app para se conectar ao emulador é a mesma nos dois cenários.

import 'package:firebase_data_connect/firebase_data_connect.dart';
import 'generated/movies.dart';

MoviesConnector.instance.dataConnect
          .useDataConnectEmulator('127.0.0.1', 9399);

// Make calls from your app
QueryRef<ListMoviesData, void> ref = MoviesConnector.instance.listMovies.ref();

Para alternar para os recursos de produção, comente as linhas para se conectar ao emulador.

Usar consultas no lado do cliente

O código gerado já vem com referências de consulta predefinidas. Basta importar e chamar execute neles.

import 'generated/movies.dart';

await MoviesConnector.instance.listMovies().execute();

Chamar métodos de consulta do SDK

Confira um exemplo com essas funções de atalho de ação:

import 'generated/movies.dart';

function onBtnClick() {
  // This will call the generated Dart from the CLI and then make an HTTP request to the server.
  MoviesConnector.instance.listMovies().execute().then(data => showInUI(data)); // == MoviesConnector.instance.listMovies().ref().execute();
}

Campos opcionais:

Algumas consultas podem ter campos opcionais. Nesses casos, o SDK do Flutter expõe um método de builder e precisa ser definido separadamente.

Por exemplo, o campo rating é opcional ao chamar createMovie, então você precisa fornecê-lo na função do builder.

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi"}).rating(5).execute();

Receber notificações sobre mudanças

Você pode se inscrever para receber alterações, que serão atualizadas sempre que você executar uma consulta.

QueryRef<ListMoviesData, void> listRef = MoviesConnector.instance.listMovies().ref();

// subscribe will immediately invoke the query if no execute was called on it previously.
listRef.subscribe().listen((data) {
  updateUIWithMovies(data.movies);
});

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi" }).rating(5).execute();
await listRef.execute(); // will update the subscription above`

Usar mutações no lado do cliente

As mutações são acessíveis da mesma forma que as consultas.

await MoviesConnector.instance.createMovie({ title: 'Empire Strikes Back', releaseYear: 1980, genre: "Sci-Fi" }).rating(5).execute();

Tipos de dados no SDK do Dart

O servidor Data Connect representa tipos de dados comuns do GraphQL. Elas são representadas no SDK da seguinte maneira.