생성된 Flutter SDK 사용

Firebase Data Connect 클라이언트 SDK를 사용하면 Firebase 앱에서 직접 서버 측 쿼리와 변형을 호출할 수 있습니다. Data Connect 서비스에 배포하는 스키마, 쿼리, 변형을 설계할 때 동시에 맞춤 클라이언트 SDK를 생성합니다. 그런 다음 이 SDK의 메서드를 클라이언트 로직에 통합합니다.

다른 곳에서 언급했듯이 Data Connect 쿼리와 변형은 클라이언트 코드에서 제출되지 않으며 서버에서 실행됩니다. 대신 배포 시 Data Connect 작업은 Cloud Functions와 같이 서버에 저장됩니다. 즉, 기존 사용자를 손상시키지 않도록 (예: 이전 앱 버전) 상응하는 클라이언트 측 변경사항을 배포해야 합니다.

그렇기 때문에 Data Connect는 서버에 배포된 스키마, 쿼리, 변형의 프로토타입을 만들 수 있는 개발자 환경과 도구를 제공합니다. 또한 프로토타입을 만드는 동안 클라이언트 측 SDK를 자동으로 생성합니다.

서비스 및 클라이언트 앱 업데이트를 반복한 후에는 서버 측 업데이트와 클라이언트 측 업데이트를 모두 배포할 수 있습니다.

Flutter SDK 생성

대부분의 Firebase 프로젝트와 마찬가지로 Firebase Data Connect 클라이언트 코드 작업은 로컬 프로젝트 디렉터리에서 이루어집니다. Data Connect VS Code 확장 프로그램과 Firebase CLI는 모두 클라이언트 코드를 생성하고 관리하는 데 중요한 로컬 도구입니다.

SDK 생성 옵션은 프로젝트를 초기화할 때 생성된 dataconnect.yaml 파일의 여러 항목에 키가 지정됩니다.

SDK 생성 초기화

connector.yaml에서 outputDir, package, 웹 SDK의 경우 packageJsonDir를 추가합니다.
connectorId: movies
generate:
  dartSdk:
    outputDir: ../../lib/generated # Feel free to change this to a different path
    package: movies

outputDir는 생성된 SDK를 출력할 위치를 지정합니다. 이 경로는 connector.yaml 파일 자체가 포함된 디렉터리를 기준으로 합니다. 원하는 경우 outputDir의 절대 경로를 제공할 수 있습니다.

package은 패키지 이름을 지정합니다.

프로토타입 제작 중에 SDK 업데이트

Data Connect VS Code 확장 프로그램 및 Data Connect 에뮬레이터를 사용하여 대화형으로 프로토타입을 제작하는 경우 스키마, 쿼리, 변형을 정의하는 .gql 파일을 수정하는 동안 SDK 소스 파일이 자동으로 생성되고 업데이트됩니다. 이 기능은 핫 (재)로드 워크플로에 유용할 수 있습니다.

다른 시나리오에서는 Firebase CLI에서 Data Connect 에뮬레이터를 사용하는 경우 .gql 업데이트에 워치를 설정하고 SDK 소스를 자동으로 업데이트할 수 있습니다.

또는 .gql 파일이 변경될 때마다 CLI를 사용하여 SDK를 다시 생성할 수 있습니다.

firebase dataconnect:sdk:generate --watch

통합 및 프로덕션 출시용 SDK 생성

CI 테스트를 위해 제출할 프로젝트 소스를 준비하는 등의 시나리오에서는 Firebase CLI를 호출하여 일괄 업데이트할 수 있습니다.

이러한 경우에는 firebase dataconnect:sdk:generate를 사용합니다.

클라이언트 코드 설정

Data Connect 앱 초기화

먼저 표준 Firebase 설정 안내에 따라 앱을 초기화합니다.

그런 다음 Data Connect 플러그인을 설치합니다.

flutter pub add firebase_data_connect

Data Connect Flutter SDK 초기화

Data Connect를 설정하는 데 사용한 정보를 사용하여 Data Connect 인스턴스를 초기화합니다 (Firebase 콘솔의 Data Connect 탭에서 모두 사용 가능).

라이브러리 가져오기

클라이언트 코드를 초기화하는 데 필요한 두 가지 가져오기 세트, 즉 일반 Data Connect 가져오기와 생성된 특정 SDK 가져오기가 있습니다.

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

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

Flutter 앱 프로토타입 제작 및 테스트

로컬 에뮬레이터를 사용하도록 클라이언트 계측

Data Connect VS Code 확장 프로그램 또는 CLI에서 Data Connect 에뮬레이터를 사용할 수 있습니다.

에뮬레이터에 연결하도록 앱을 계측하는 방법은 두 시나리오 모두 동일합니다.

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();

프로덕션 리소스로 전환하려면 에뮬레이터에 연결하는 선을 주석 처리합니다.

클라이언트 측에서 쿼리 사용

생성된 코드에는 사전 정의된 쿼리 참조가 이미 포함되어 있습니다. execute를 가져와서 호출하기만 하면 됩니다.

import 'generated/movies.dart';

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

SDK 쿼리 메서드 호출

다음은 이러한 작업 바로가기 함수를 사용하는 예입니다.

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();
}

선택 필드

일부 쿼리에는 선택사항 필드가 있을 수 있습니다. 이 경우 Flutter SDK는 빌더 메서드를 노출하며 별도로 설정해야 합니다.

예를 들어 createMovie를 호출할 때 rating 필드는 선택사항이므로 빌더 함수에서 제공해야 합니다.

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

변경사항 구독

변경사항을 구독할 수 있으며, 이 경우 쿼리를 실행할 때마다 업데이트됩니다.

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`

클라이언트 측에서 변형 사용

변형은 쿼리와 동일한 방식으로 액세스할 수 있습니다.

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

Dart SDK의 데이터 유형

Data Connect 서버는 일반적인 GraphQL 데이터 유형을 나타냅니다. 이는 SDK에서 다음과 같이 표시됩니다.

데이터 연결 유형 Dart
타임스탬프 firebase_data_connect.Timestamp
정수 (32비트) int
날짜 DateTime
UUID : 범용 고유 식별자 문자열
Int64 int
부동 소수점 수 double
불리언 부울
모두 firebase_data_connect.AnyValue