Pierwsze kroki z Firebase Data Connect

Z tego krótkiego wprowadzenia dowiesz się, jak:

• Dodaj Firebase Data Connect do swojego projektu Firebase.
• Konfigurowanie środowiska programistycznego obejmującego Visual Studio Rozszerzenie kodu do pracy z instancją produkcyjną.
• Następnie pokażemy Ci, jak:
  • Utwórz schemat aplikacji do poczty e-mail i wdróż ją w środowisku produkcyjnym.
  • Zdefiniuj zapytania i mutacje dla schematu.
  • Wdrożenie ostatecznego prototypu w środowisku produkcyjnym.

Wymagania wstępne

Aby skorzystać z tego krótkiego wprowadzenia, musisz mieć:

• Linux, macOS lub Windows
• Visual Studio Code

Połącz z projektem Firebase

1. Jeśli nie masz jeszcze utworzonego projektu Firebase,
   1. W konsoli Firebase kliknij Dodaj projekt i postępuj zgodnie z instrukcjami wyświetlanymi na ekranie.

2. Przenieś projekt na abonament Blaze. Dzięki temu możesz utworzyć Cloud SQL dla instancji PostgreSQL.

3. Przejdź do sekcji Połączenie danych w konsoli Firebase i postępuj zgodnie z procesem konfiguracji usługi.

4. Wybierz lokalizację bazy danych Cloud SQL for PostgreSQL.

5. Zapisz nazwy i identyfikatory projektów, usług i baz danych, aby móc je później potwierdzić.

6. Wykonaj pozostałe kroki konfiguracji i kliknij Gotowe.

Wybieranie i konfigurowanie środowiska programistycznego

Data Connect obsługuje 2 procesy programowania prototypów:

• Jeśli jesteś programistą Kotlin na Androida lub stron internetowych, możesz używać VS Code rozwoju w celu tworzenia lokalnych prototypów schematów i działań przy jednoczesnym połączeniu instancję Cloud SQL for PostgreSQL.
• Jeśli jesteś programistą stron internetowych, możesz użyć programowania IDX do tworzenia prototypów w obszarze roboczym IDX przy użyciu wstępnie skonfigurowanego szablonu IDX w PostgreSQL, Rozszerzenie VS Code z emulatorem Data Connect i kodem krótkiego wprowadzenia którą skonfigurować. Więcej informacji znajdziesz na Witryna projektu IDX.

To krótkie wprowadzenie dotyczy procesu tworzenia rozszerzenia VS Code. Aby kontynuować:

1. Utwórz nowy katalog dla projektu lokalnego.
2. Otwórz VS Code w nowym katalogu.

3. Pobierz rozszerzenie z Firebase Storage w pakiecie VSIX.

4. W aplikacji VS Code w menu Widok wybierz Rozszerzenia.

5. Na pasku tytułu panelu Rozszerzenia kliknij ikonę menu. more_horiz, a następnie Zainstaluj z VSIX...

Opcjonalnie możesz zainstalować lokalną bazę danych PostgreSQL na potrzeby programowania lokalnego za pomocą emulatora Data Connect. Ta konfiguracja jest omówiona na końcu tym krótkim wprowadzeniu.

Skonfiguruj projekt lokalny

Zainstaluj interfejs wiersza poleceń, postępując zgodnie z zwykłymi instrukcjami. Jeśli masz npm już zainstalowane, uruchom następujące polecenie:

npm install -g firebase-tools

Skonfiguruj katalog projektu

Aby skonfigurować projekt lokalny, zainicjuj katalog projektu.

W panelu po lewej stronie „VS Code” kliknij ikonę Firebase, aby otworzyć Interfejs rozszerzenia kodu.

W interfejsie rozszerzenia Firebase:

1. Zaloguj się na swoje konto.
2. Kliknij przycisk Uruchom aplikację Firebase init.
3. Sprawdź, czy na karcie Terminal (Terminal) w dolnym panelu VS Code (Kod VS) widzisz jakieś komunikaty.
4. Wybierz Data Connect jako funkcję do użycia w tym katalogu.
5. Gdy pojawi się prośba, podaj identyfikatory projektów, usług i baz danych Projekt Data Connect utworzony wcześniej w konsoli.

Tworzenie schematu

W pliku /dataconnect/schema/schema.gql projektu Firebase zacznij definiować schemat GraphQL obejmujący użytkowników i adresy e-mail.

Użytkownik

W Data Connect pola GraphQL są mapowane na kolumny. Użytkownicy mają uid, name i e-mail address. Usługa Data Connect rozpoznaje kilka podstawowe typy danych: String i Date.

Skopiuj ten fragment lub usuń znacznik komentarza z odpowiednich wierszy w pliku.

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

type User @table(key: "uid") {
   uid: String!
   name: String!
   address: String!
}

Domyślnie usługa Firebase Data Connect doda klucz UUID id, jeśli żaden nie jest podany. W tym przypadku jednak chcesz, aby mój uid był kluczem podstawowym, można zrobić za pomocą dyrektywy @table(key: "uid").

E-mail

Gdy masz już użytkowników, możesz modelować adresy e-mail. Możesz tu dodać typową dla pola (lub kolumny) danych e-maili. Tym razem pomijamy dodawanie klucza podstawowego. ponieważ w zarządzaniu nią możesz polegać.

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

type Email @table {
   subject: String!
   sent: Date!
   text: String!
   from: User!
}

Zauważ, że pole from jest zmapowane na typ User. Usługa Data Connect rozumie, że jest to relacja między zasobem Email i User. Te relacje będą zarządzane za Ciebie.

Wdrażanie schematu w środowisku produkcyjnym

Jeśli używasz rozszerzenia Firebase VS Code do obsługi produkcyjna baza danych, musisz wdrożyć schemat, zanim przejdziesz dalej. Po wdrożenia schematu w produkcyjnej bazie danych powinien być dostępny schemat w konsoli.

1. Do wdrożenia możesz użyć rozszerzenia Firebase VS Code.
   • W interfejsie rozszerzenia w panelu Połączenie danych Firebase kliknij Wdróż.
2. Konieczne może być sprawdzenie zmian w schemacie i zatwierdzenie tych potencjalnie szkodliwych modyfikacji. Wyświetli się prośba o:
   • Sprawdź zmiany schematu za pomocą: firebase dataconnect:sql:diff
   • Jeśli zmiany są zadowalające, zastosuj je, zaczynając od firebase dataconnect:sql:migrate

Dodawanie danych do tabel

W panelu edytora kodu VS przyciski CodeLens są widoczne nad Typy GraphQL w polu /dataconnect/schema/schema.gql. Od wdrożenia schematu w środowisku produkcyjnym możesz użyć opcji Dodaj dane i Uruchom (produkcyjne). dodają dane do bazy danych w backendzie.

Aby dodać rekordy do tabel User i Email:

1. W usłudze schema.gql kliknij przycisk Dodaj dane nad typem User
   .
2. W wygenerowanym pliku User_insert.gql zakoduj na stałe dane dotyczące 3 pola.
3. Kliknij przycisk Uruchom (produkcyjna).
   
4. Powtórz poprzednie kroki, aby dodać rekord do tabeli Email, podając uid użytkownika w polu fromUid zgodnie z zapytaniem w wygenerowanym Mutacja Email_insert.

Zdefiniuj zapytanie

Teraz najciekawsza część to zapytania. Programiści są przyzwyczajeni do pisania kodu SQL, niż zapytań GraphQL, więc na początku może to wyglądać nieco inaczej. Interfejs GraphQL jest jednak o wiele bardziej zwięzły i bezpieczny do pisania niż nieprzetworzony SQL. Podobnie jak w przypadku VS Code ułatwia tworzenie aplikacji.

Zacznij edytować plik /dataconnect/default-connector/queries.gql. Jeśli chcesz , aby otrzymać wszystkie e-maile, użyj takiego zapytania.

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

query ListEmails @auth(level: NO_ACCESS) {
  emails {
    id, subject, text, sent
    from {
      name
    }
  }
}

Wykonaj zapytanie, korzystając z pobliskiego przycisku CodeLens.

Bardzo ciekawą funkcją jest możliwość traktowania takie jak graf. Adres e-mail zawiera pole from, które odwołuje się do Użytkownik, możesz zagnieździć to pole i uzyskać o nim informacje.

Wdrażanie schematu i zapytania w środowisku produkcyjnym

Udało Ci się przejść iterację rozwojową. Teraz możesz wdrożyć schematy, dane i zapytania do serwera za pomocą Firebase. rozszerzenia lub interfejsu wiersza poleceń Firebase – tak samo jak przy użyciu schematu.

Jeśli do wdrożenia używasz rozszerzenia Firebase VS Code, kliknij Deploy all (Wdróż wszystkie) Przycisk

Po wdrożeniu będziesz mieć możliwość wyświetlania i uruchamiania operacji w konsoli . Twoja usługa Data Connect będzie gotowa do przetwarzania operacji od klientów. W instancji Cloud SQL for PostgreSQL zostanie zaktualizowana ostatecznego wdrożenia wygenerowanego schematu i danych.

(Opcjonalnie) Zainstaluj lokalnie PostgreSQL

Lokalna instalacja PostgreSQL i integracja z emulatorem pozwala w całkowicie lokalnym środowisku programistycznym.

Możesz zainstalować nową instancję PostgreSQL lub użyć istniejącej.

Zainstaluj PostgreSQL

Zainstaluj PostgreSQL w wersji 15.x, postępując zgodnie z instrukcjami dla swojej platformy.

• macOS: Pobierz i zainstaluj Postgres.app.
• Windows: użyj instalatora EDB ze strony pobierania PostgreSQL.
• Docker: pobieranie i uruchamianie pgvector/pgvector:15, który obsługuje zarówno PostgreSQL 15.x, jak i wektorowe.
• Linux: zalecamy korzystanie z Dockera z poprzednim obrazem, ale możesz też wykonaj instrukcje alternatywne dotyczące popularnych dystrybucji.

Zanotuj nazwę hosta, port, nazwę użytkownika i hasło oraz powiązane parametry wyjściowe podczas i sekwencji instalacji.

Aby połączyć się z instancją PostgreSQL, emulator potrzebuje:

• Te parametry konfiguracji konfiguracji
• Nazwa bazy danych z urządzenia dataconnect.yaml i odpowiednio nazwana zainicjowaniu bazy danych w instancji lokalnej.

Użyj lokalnej instancji PostgreSQL

Możesz użyć istniejącej lokalnej instancji PostgreSQL, aktualizując Ustawienia emulatora Data Connect.

firebase setup:emulators:dataconnect

Gdy pojawi się prośba, wpisz ciąg połączenia PostgreSQL w tym formacie: postgresql://postgresusername:postgrespassword@localhost:5432/postgresdatabase?sslmode=disable

Więcej informacji o ciągu połączenia znajdziesz w Dokumentacja PostgreSQL.

Łączenie z lokalną instancją PostgreSQL

Po zakończeniu konfiguracji połączenie z lokalną bazą danych:

1. W panelu po lewej stronie w usłudze VS Code kliknij ikonę Firebase, aby otworzyć Interfejs rozszerzenia Firebase VS Code.
2. Kliknij przycisk Connect to Local PostgreSQL (Połącz z lokalnym programem PostgreSQL).

Dalsze kroki