با Firebase Data Connect شروع کنید

در این شروع سریع، یاد خواهید گرفت که چگونه Firebase Data Connect در برنامه خود با یک نمونه تولیدی SQL ایجاد کنید. شما:

  • Firebase Data Connect به پروژه Firebase خود اضافه کنید.
  • یک نمونه Cloud SQL برای برنامه خود تهیه کنید.
  • یک محیط توسعه شامل پسوند Visual Studio Code برای کار با یک نمونه تولید راه اندازی کنید.
  • سپس به شما نشان خواهیم داد که چگونه:
    • یک طرحواره برای یک برنامه فیلم ایجاد کنید
    • پرس و جوها و جهش هایی را که در برنامه شما استفاده می شود را تعریف کنید
    • پرس و جوها و جهش های خود را با داده های نمونه آزمایش کنید
    • SDKهایی با تایپ قوی ایجاد کنید و از آنها در برنامه خود استفاده کنید
    • طرح نهایی، پرس و جوها و داده های خود را در فضای ابری مستقر کنید .

یک پروژه Firebase و پایگاه داده Cloud SQL ایجاد کنید

  1. اگر قبلاً این کار را نکرده اید، یک پروژه Firebase ایجاد کنید.
    1. در کنسول Firebase ، روی افزودن پروژه کلیک کنید، سپس دستورالعمل‌های روی صفحه را دنبال کنید.
  2. به بخش Data Connect کنسول Firebase بروید و گردش کار راه اندازی محصول را دنبال کنید.

  3. پروژه خود را به پلان Blaze ارتقا دهید. این به شما امکان می دهد یک Cloud SQL برای نمونه PostgreSQL ایجاد کنید.

  4. مکانی را برای پایگاه داده Cloud SQL خود برای PostgreSQL انتخاب کنید.

  5. برای تأیید بعداً به نام و شناسه پروژه، سرویس و پایگاه داده توجه کنید.

  6. جریان راه‌اندازی باقی‌مانده را دنبال کنید و روی Done کلیک کنید.

یک جریان توسعه را انتخاب کنید

Data Connect دو راه را برای نصب ابزارهای توسعه به شما ارائه می دهد.

محیط توسعه را تنظیم کنید

  1. یک دایرکتوری جدید برای پروژه محلی خود ایجاد کنید.

  2. دستور زیر را در دایرکتوری جدیدی که ایجاد کردید اجرا کنید.

      curl -sL https://firebase.tools/dataconnect | bash

    این اسکریپت سعی می کند محیط توسعه را برای شما تنظیم کند و یک IDE مبتنی بر مرورگر راه اندازی کند. این IDE ابزارهایی از جمله یک پسوند کد VS از پیش همراه را ارائه می دهد تا به شما کمک کند طرحواره خود را مدیریت کنید و پرس و جوها و جهش هایی را برای استفاده در برنامه خود تعریف کنید و SDK هایی با تایپ قوی ایجاد کنید.

alias dataconnect='curl -sL https://firebase.tools/dataconnect | bash'

دایرکتوری پروژه خود را تنظیم کنید

برای راه اندازی پروژه محلی خود، دایرکتوری پروژه خود را مقداردهی اولیه کنید. در پنجره IDE، در پانل سمت چپ، روی نماد Firebase کلیک کنید تا رابط کاربری افزونه Data Connect VS Code باز شود:

  1. روی دکمه Sign in with Google کلیک کنید.
  2. روی دکمه Connect a Firebase project کلیک کنید و پروژه ای را که قبلا در کنسول ایجاد کردید انتخاب کنید.
  3. روی دکمه Run firebase init کلیک کنید و جریان را کامل کنید.

  4. روی دکمه Start emulators کلیک کنید.

یک طرحواره ایجاد کنید

در فهرست پروژه Firebase، در فایل /dataconnect/schema/schema.gql ، شروع به تعریف یک طرح GraphQL کنید که شامل فیلم‌ها می‌شود.

فیلم

در Data Connect ، فیلدهای GraphQL به ستون‌ها نگاشت می‌شوند. نوع Movie دارای id , title , imageUrl و genre است . Data Connect انواع داده های اولیه String و UUID را تشخیص می دهد.

قطعه زیر را کپی کنید یا خطوط مربوطه را در فایل از نظر خارج کنید.

# File `/dataconnect/schema/schema.gql`

# By default, a UUID id key will be created by default as primary key.
type Movie @table {
  id: UUID! @default(expr: "uuidV4()")
  title: String!
  imageUrl: String!
  genre: String
}

MovieMetadata

اکنون که فیلم دارید، می توانید ابرداده فیلم را مدل کنید.

قطعه زیر را کپی کنید یا خطوط مربوطه را در فایل از نظر خارج کنید.

# Movie - MovieMetadata is a one-to-one relationship
type MovieMetadata @table {
  # This time, we omit adding a primary key because
  # you can rely on Data Connect to manage it.

  # @unique indicates a 1-1 relationship
  movie: Movie! @unique
  # movieId: UUID <- this is created by the above reference
  rating: Float
  releaseYear: Int
  description: String
}

توجه داشته باشید که فیلد movie به نوعی از Movie نگاشت شده است. Data Connect می داند که این رابطه بین Movie و MovieMetadata است و این رابطه را برای شما مدیریت می کند.

درباره طرحواره های Data Connect در مستندات بیشتر بیاموزید

طرحواره خود را در تولید مستقر کنید

قبل از ادامه، باید طرحواره خود را مستقر کنید.

در رابط کاربری افزونه، در پانل Firebase Data Connect ، روی Deploy to production کلیک کنید.

پس از استقرار طرح خود در پایگاه داده تولید خود، باید بتوانید طرح را در کنسول Firebase مشاهده کنید.

داده ها را به جداول خود اضافه کنید

در پانل ویرایشگر IDE، می‌توانید مشاهده کنید که دکمه‌های CodeLens روی انواع GraphQL در /dataconnect/schema/schema.gql ظاهر می‌شوند. از آنجایی که شما طرحواره خود را برای تولید مستقر کرده اید، می توانید از دکمه های Add data و Run (Production) برای افزودن داده به پایگاه داده خود در باطن استفاده کنید.

برای افزودن رکوردها به جدول Movie :

  1. در schema.gql ، روی دکمه افزودن داده در بالای اعلان نوع Movie کلیک کنید.
    لنز کد دکمه افزودن داده برای Firebase Data Connect
  2. در فایل Movie_insert.gql که تولید می‌شود، داده‌های کد سخت برای چهار فیلد وجود دارد.
  3. روی دکمه Run (Production) کلیک کنید.
    دکمه اجرای کد لنز برای اتصال داده Firebase
  4. مراحل قبلی را تکرار کنید تا یک رکورد به جدول MovieMetadata اضافه کنید، همانطور که در جهش MovieMetadata_insert ایجاد شده، id فیلم خود را در قسمت movieId ارائه کنید.

برای تأیید سریع داده ها اضافه شد:

  1. به schema.gql برگردید، روی دکمه Read data بالای اعلان نوع Movie کلیک کنید.
  2. در فایل Movie_read.gql به دست آمده، روی دکمه Run (Production) کلیک کنید تا کوئری اجرا شود.

درباره جهش های Data Connect در مستندات بیشتر بیاموزید

سوال خود را تعریف کنید

در حال حاضر بخش سرگرم کننده، نمایش داده شد. به‌عنوان یک توسعه‌دهنده، شما به نوشتن پرس‌و‌جوهای SQL به جای پرس‌وجوهای GraphQL عادت دارید، بنابراین در ابتدا کمی متفاوت به نظر می‌رسد. با این حال، GraphQL بسیار مختصرتر و ایمن تر از SQL خام است. و برنامه افزودنی VS Code ما تجربه توسعه را آسان می کند.

ویرایش فایل /dataconnect/connector/queries.gql را شروع کنید. اگر می‌خواهید همه فیلم‌ها را دریافت کنید، از یک پرس و جو مانند این استفاده کنید.

# File `/dataconnect/connector/queries.gql`

# @auth() directives control who can call each operation.
# Anyone should be able to list all movies, so the auth level
# is set to PUBLIC
query ListMovies @auth(level: PUBLIC) {
  movies {
    id
    title
    imageUrl
    genre
  }
}

پرس و جو را با استفاده از دکمه CodeLens نزدیک اجرا کنید.

درباره پرسش‌های Data Connect در مستندات بیشتر بیاموزید

SDK ها را ایجاد کنید

  1. روی دکمه افزودن SDK به برنامه کلیک کنید.

  2. در گفتگوی ظاهر شده، دایرکتوری حاوی کد برنامه خود را انتخاب کنید. کد SDK Data Connect در آنجا تولید و ذخیره خواهد شد.

  3. پلت فرم برنامه خود را انتخاب کنید، سپس توجه داشته باشید که کد SDK بلافاصله در فهرست انتخابی شما ایجاد می شود.

طرح و پرس و جو خود را در تولید مستقر کنید

شما از طریق یک تکرار توسعه کار کرده اید. اکنون می‌توانید طرح، داده‌ها و درخواست‌های خود را با رابط کاربری افزونه Firebase یا Firebase CLI روی سرور مستقر کنید، دقیقاً همانطور که با طرحواره خود انجام دادید.

در پنجره IDE، در VS Code Extension UI، روی دکمه Deploy to production کلیک کنید.

پس از استقرار، به کنسول Firebase بروید تا بررسی کنید که طرحواره، عملیات و داده‌ها در فضای ابری آپلود شده‌اند. شما باید بتوانید طرحواره را مشاهده کنید و عملیات خود را روی کنسول نیز اجرا کنید. Cloud SQL برای نمونه PostgreSQL با طرح و داده های تولید شده نهایی مستقر شده خود به روز می شود.

درباره استفاده از شبیه ساز Data Connect در مستندات بیشتر بیاموزید

از SDK ها برای فراخوانی درخواست خود از یک برنامه استفاده کنید

اکنون که طرح و پرس و جو شما برای تولید مستقر شده اند، می توانید از SDK که Data Connect ایجاد کرده است برای اجرای فراخوانی با Query ListMovies خود استفاده کنید.

وب

  1. Firebase را به برنامه وب خود اضافه کنید.

  2. در فایل اصلی برنامه React شما:

    • SDK تولید شده خود را وارد کنید
    • روش های Data Connect فراخوانی کنید.

    می توانید قطعه زیر را کپی کرده و به عنوان یک برنامه مستقل اجرا کنید.

    import React from 'react';
import ReactDOM from 'react-dom/client';

// Generated queries.
// Update as needed with the path to your generated SDK.
import { listMovies, ListMoviesData } from '@movie-app/movies';

function App() {
  const [movies, setMovies] = useState<ListMoviesData['movies']>([]);
  useEffect(() => {
    listMovies.then(res => setMovies(res.data));
  }, []);
  return (
    movies.map(movie => <h1>{movie.title}</h1>);
  );
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<App />);

سویفت

  1. Firebase را به برنامه iOS خود اضافه کنید.

  2. برای استفاده از SDK تولید شده، آن را به عنوان یک وابستگی در Xcode پیکربندی کنید.

    در نوار پیمایش بالای Xcode، File > Add Package Dependencies > Add Local را انتخاب کنید و پوشه حاوی Package.swift تولید شده را انتخاب کنید.

  3. در نماینده اصلی برنامه شما:

    • SDK تولید شده خود را وارد کنید
    • روش های Data Connect فراخوانی کنید.

    می توانید قطعه زیر را کپی کرده و به عنوان یک برنامه مستقل اجرا کنید.

    import SwiftUI

import FirebaseDataConnect
// Generated queries.
// Update as needed with the package name of your generated SDK.
import <CONNECTOR-PACKAGE-NAME>

let connector = DataConnect.moviesConnector

struct ListMovieView: View {
@StateObject private var queryRef = connector.listMovies.ref()

    var body: some View {
        VStack {
            Button {
                Task {
                    do {
                        try await refresh()
                    } catch {
                        print("Failed to refresh: \(error)")
                    }
                }
            } label: {
                Text("Refresh")
            }

            // use the query results in a view
            ForEach(queryRef.data?.movies ?? [], id: \.self.id) { movie in
                    Text(movie.title)
                }
            }
    }
    @MainActor
    func refresh() async throws {
        _ = try await queryRef.execute()
    }

    struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ListMovieView()
    }
}

کاتلین اندروید

  1. Firebase را به برنامه اندروید خود اضافه کنید.

  2. برای استفاده از SDK تولید شده، Data Connect به عنوان یک وابستگی در Gradle پیکربندی کنید.

    plugins و dependencies در app/build.gradle.kts خود به روز کنید.

    plugins {
  // Use whichever versions of these dependencies suit your application.
  // The versions shown here were the latest as of December 03, 2024.
  // Note, however, that the version of kotlin("plugin.serialization") must,
  // in general, match the version of kotlin("android").
  id("com.android.application") version "8.7.3"
  id("com.google.gms.google-services") version "4.4.2"
  val kotlinVersion = "2.1.0"
  kotlin("android") version kotlinVersion
  kotlin("plugin.serialization") version kotlinVersion
}

dependencies {
  // Use whichever versions of these dependencies suit your application.
  // The versions shown here were the latest versions as of December 03, 2024.
  implementation("com.google.firebase:firebase-dataconnect:16.0.0-beta03")
  implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core:1.9.0")
  implementation("org.jetbrains.kotlinx:kotlinx-serialization-core:1.7.3")

  // These dependencies are not strictly required, but will very likely be used
  // when writing modern Android applications.
  implementation("org.jetbrains.kotlinx:kotlinx-coroutines-android:1.9.0")
  implementation("androidx.appcompat:appcompat:1.7.0")
  implementation("androidx.activity:activity-ktx:1.9.3")
  implementation("androidx.lifecycle:lifecycle-viewmodel-ktx:2.8.7")
  implementation("com.google.android.material:material:1.12.0")
}

  3. در فعالیت اصلی برنامه شما:

    • SDK تولید شده خود را وارد کنید
    • روش های Data Connect فراخوانی کنید.

    می توانید قطعه زیر را کپی کرده و به عنوان یک برنامه مستقل اجرا کنید.

    import android.os.Bundle
import android.widget.TextView
import androidx.appcompat.app.AppCompatActivity
import androidx.lifecycle.Lifecycle
import androidx.lifecycle.lifecycleScope
import androidx.lifecycle.repeatOnLifecycle
import kotlinx.coroutines.launch


private val connector = com.myapplication.MoviesConnector.instance

class MainActivity : AppCompatActivity() {

  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)
    val textView: TextView = findViewById(R.id.text_view)

    lifecycleScope.launch {
      lifecycle.repeatOnLifecycle(Lifecycle.State.STARTED) {
        
        val result = connector.listMovies.runCatching { execute { } }
        
        val newTextViewText = result.fold(
          onSuccess = {
            val titles = it.data.movies.map { it.title }
            "${titles.size} movies: " + titles.joinToString(", ")
          },
          onFailure = { "ERROR: ${it.message}" }
        )
        textView.text = newTextViewText
      }
    }
  }
}

بال زدن

  1. Firebase را به برنامه Flutter خود اضافه کنید.
  2. flutterfire CLI dart pub global activate flutterfire_cli .
  3. flutterfire configure اجرا کنید.

  4. در عملکرد اصلی برنامه شما:

    • SDK تولید شده خود را وارد کنید
    • روش های Data Connect فراخوانی کنید.

    می توانید قطعه زیر را کپی کرده و به عنوان یک برنامه مستقل اجرا کنید. 

import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';
import 'firebase_options.dart';

// Generated queries.
// Update as needed with the path to your generated SDK

import 'movies_connector/movies.dart';

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  
  
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
            body: Column(children: [
      ConstrainedBox(
        constraints: const BoxConstraints(maxHeight: 200),
        child: FutureBuilder(
            future: MoviesConnector.instance.listMovies().execute(),
            builder: (context, snapshot) {
              if (snapshot.connectionState == ConnectionState.done) {
                return ListView.builder(
                  scrollDirection: Axis.vertical,
                  itemBuilder: (context, index) => Card(
                      child: Text(
                    snapshot.data!.data.movies[index].title,
                  )),
                  itemCount: snapshot.data!.data.movies.length,
                );
              }
              return const CircularProgressIndicator();
            }),
      )
    ])));
  }
}

مراحل بعدی

پروژه مستقر خود را مرور کنید و ابزارهای بیشتری را کشف کنید:

  • داده ها را به پایگاه داده خود اضافه کنید، طرحواره های خود را بررسی و اصلاح کنید، و سرویس Data Connect خود را در کنسول Firebase نظارت کنید. به اطلاعات بیشتر در اسناد دسترسی پیدا کنید. به عنوان مثال، از آنجایی که شروع سریع را کامل کرده اید:

  • درباره طرحواره، پرس و جو و توسعه جهش بیشتر بیاموزید

  • درباره ایجاد SDK های مشتری و درخواست های تماس و جهش از کد مشتری برای وب ، Android ، iOS و Flutter بیاموزید.