เริ่มต้นใช้งาน Firebase Data Connect

ในการเริ่มต้นอย่างรวดเร็วนี้ คุณจะได้ศึกษาวิธีทำสิ่งต่อไปนี้

• เพิ่ม Firebase Data Connect ลงในโปรเจ็กต์ Firebase
• ตั้งค่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์ซึ่งรวมถึงส่วนขยายโค้ด Visual Studio เพื่อทำงานร่วมกับอินสแตนซ์เวอร์ชันที่ใช้งานจริง
• จากนั้น เราจะแสดงวิธีทำสิ่งต่อไปนี้
  • สร้างสคีมาสำหรับแอปอีเมลและทำให้ใช้งานได้เป็นเวอร์ชันที่ใช้งานจริง
  • กำหนดคำค้นหาและการกลายพันธุ์สำหรับสคีมาของคุณ
  • ทำให้ต้นแบบสุดท้ายใช้งานได้จริง

สิ่งที่ต้องดำเนินการก่อน

ในการใช้การเริ่มต้นอย่างรวดเร็วนี้ คุณจะต้องมีสิ่งต่อไปนี้

• Linux, macOS หรือ Windows
• โค้ด Visual Studio

เพิ่ม Data Connect ในโปรเจ็กต์และสร้างแหล่งข้อมูล

1. สร้างโปรเจ็กต์ Firebase หากยังไม่มี
   1. ในคอนโซล Firebase ให้คลิกเพิ่มโปรเจ็กต์ แล้วทำตามวิธีการบนหน้าจอ

2. อัปเกรดโปรเจ็กต์เป็นแพ็กเกจ Blaze ซึ่งจะช่วยให้คุณสร้างอินสแตนซ์ Cloud SQL สำหรับ PostgreSQL ได้

3. ไปที่ส่วน Data Connect ของคอนโซล Firebase แล้วทำตามเวิร์กโฟลว์การตั้งค่าผลิตภัณฑ์

4. เลือกตำแหน่งที่ตั้งของฐานข้อมูล CloudSQL สำหรับ PostgreSQL

5. จดชื่อและรหัสโปรเจ็กต์ บริการ และฐานข้อมูลไว้เพื่อยืนยันในภายหลัง

6. ทำตามขั้นตอนการตั้งค่าที่เหลือ แล้วคลิกเสร็จสิ้น

เลือกและตั้งค่าสภาพแวดล้อมในการพัฒนาซอฟต์แวร์

คุณจะเริ่มต้นด้วย Data Connect จากการสร้างต้นแบบแอปในโค้ด Visual Studio

นอกจากนี้ คุณยังติดตั้งฐานข้อมูล PostgreSQL ในเครื่องสำหรับการพัฒนาในเครื่องได้ด้วยโปรแกรมจำลอง Data Connect โดยการตั้งค่านี้มีอยู่ในตอนท้ายของ คู่มือการเริ่มต้นอย่างรวดเร็วนี้

Data Connect รองรับประสบการณ์การพัฒนา 2 แบบสำหรับการสร้างต้นแบบ ดังนี้

• หากคุณเป็นนักพัฒนาซอฟต์แวร์เว็บหรือ Kotlin Android คุณจะสร้างต้นแบบของสคีมาและการดำเนินการในเครื่องขณะเชื่อมต่อกับ Cloud SQL สำหรับอินสแตนซ์ PostgreSQL หรือเรียกใช้ PostgreSQL ในเครื่องได้ (ไม่บังคับ)

• หากคุณเป็นนักพัฒนาซอฟต์แวร์เว็บ คุณสามารถใช้ IDX เพื่อสร้างต้นแบบในพื้นที่ทำงานของ IDX โดยใช้เทมเพลต IDX ที่กำหนดค่าไว้ล่วงหน้ากับ PostgreSQL, VS ส่วนขยายโค้ดที่มีโปรแกรมจำลอง Data Connect และการตั้งค่าโค้ดการเริ่มต้นอย่างรวดเร็วสำหรับคุณ

ตั้งค่าโปรเจ็กต์ที่อยู่ในเครื่อง

ติดตั้ง CLI โดยทําตามวิธีการทั่วไป

จากนั้นเปิดใช้การทดสอบ Firebase Data Connect

firebase experiments:enable dataconnect

เริ่มต้นไดเรกทอรีโปรเจ็กต์เพื่อตั้งค่าโปรเจ็กต์ในเครื่อง

ตั้งค่าไดเรกทอรีโปรเจ็กต์

เริ่มต้นไดเรกทอรีโปรเจ็กต์

ในแผงด้านซ้ายมือของ VS Code ให้คลิกไอคอน Firebase เพื่อเปิด UI ของส่วนขยาย Firebase VS Code

ใน UI ของส่วนขยาย Firebase ให้ทำดังนี้

1. ตรวจสอบว่าคุณได้ลงชื่อเข้าใช้แล้ว
2. ยืนยันว่าขั้นตอนการตั้งค่า Data Connect รวมถึงการจัดสรรฐานข้อมูลเสร็จสมบูรณ์โดยใช้ Google Cloud Console
3. คลิกปุ่มเรียกใช้ firebase init
4. ตรวจสอบข้อความแจ้งที่แท็บ Terminal ในแผง VS Code ด้านล่าง
5. เลือก Data Connect เป็นฟีเจอร์ที่จะใช้ในไดเรกทอรีนี้
6. เมื่อมีข้อความแจ้ง ให้ระบุรหัสโปรเจ็กต์ บริการ และฐานข้อมูลของโปรเจ็กต์ Data Connect ที่คุณสร้างไว้ก่อนหน้านี้ในคอนโซล

ขั้นตอนนี้จะสร้างไฟล์ firebase.json และ .firebaserc และไดเรกทอรีย่อย dataconnect รวมถึงไฟล์ dataconnect.yaml และ connector.yaml ที่สำคัญในไดเรกทอรีการทำงานในเครื่อง

สร้างสคีมา Data Connect และการค้นหา

การตั้งค่าของคุณเรียบร้อยแล้ว ตอนนี้เราเริ่มพัฒนาด้วย Data Connect ได้แล้ว

เริ่มใช้ GraphQL เพื่อสร้างแบบจำลองของผู้ใช้และอีเมล คุณจะได้อัปเดตแหล่งที่มาใน

• /dataconnect/schema/schema.gql
• /dataconnect/default-connector/queries.gql

เริ่มสร้างสคีมา

ในไดเรกทอรีโปรเจ็กต์ Firebase ให้จดโฟลเดอร์ dataconnect ไว้ ซึ่งจะเป็นที่ที่คุณกำหนดโมเดลข้อมูลสำหรับฐานข้อมูล Cloud SQL โดยใช้ GraphQL

ในไฟล์ /dataconnect/schema/schema.gql ให้เริ่มกำหนดสคีมาที่มีผู้ใช้และอีเมล

ผู้ใช้

ใน Data Connect ระบบจะแมปช่อง GraphQL กับคอลัมน์ ผู้ใช้จะมี uid, name และอีเมล address Data Connect รู้จักประเภทข้อมูลพื้นฐานหลายประเภท ได้แก่ String และ Date

คัดลอกข้อมูลโค้ดต่อไปนี้หรือยกเลิกการเลือกบรรทัดที่เกี่ยวข้องในไฟล์

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

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

โดยค่าเริ่มต้น Firebase Data Connect จะเพิ่มคีย์ UUID id หากไม่มีให้ไว้ แต่ในกรณีนี้ คุณต้องการให้ uid เป็นคีย์หลัก ซึ่งทำผ่านคำสั่ง @table(key: "uid") ได้

อีเมล

เมื่อมีผู้ใช้แล้ว คุณก็สร้างแบบจำลองอีเมลได้ คุณสามารถเพิ่มช่องทั่วไป (หรือคอลัมน์) สำหรับข้อมูลอีเมลได้ที่นี่ คราวนี้คุณไม่ต้องเพิ่มคีย์หลัก เพราะใช้ Data Connect จัดการได้

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

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

โปรดสังเกตว่าฟิลด์ from แมปกับประเภท User แล้ว Data Connect เข้าใจว่านี่คือความสัมพันธ์ระหว่าง Email กับ User และจะจัดการความสัมพันธ์นี้ให้คุณ

ทำให้สคีมาใช้งานได้เป็นเวอร์ชันที่ใช้งานจริง

เนื่องจากคุณใช้ส่วนขยายโค้ด Firebase VS เพื่อทำงานกับฐานข้อมูลเวอร์ชันที่ใช้งานจริง คุณจึงต้องทำให้สคีมาใช้งานได้ก่อนที่จะดำเนินการต่อ

1. คุณสามารถใช้ส่วนขยาย Firebase VS Code เพื่อทำให้ใช้งานได้
   • ใน UI ของส่วนขยาย ในแผง Firebase Data Connect ให้คลิกทำให้ใช้งานได้

2. หรือจะใช้ Firebase CLI ก็ได้

   firebase deploy
   

3. ในขั้นตอนส่วนขยายหรือ CLI คุณอาจต้องตรวจสอบการเปลี่ยนแปลงสคีมาและอนุมัติการแก้ไขที่อาจเป็นผลเสีย ระบบจะขอให้คุณดำเนินการดังนี้

   • ตรวจสอบการเปลี่ยนแปลงสคีมาโดยใช้ firebase dataconnect:sql:diff
   • เมื่อพอใจกับการเปลี่ยนแปลงแล้ว ให้นำการเปลี่ยนแปลงไปใช้โดยใช้ขั้นตอนที่เริ่มต้นภายในวันที่ firebase dataconnect:sql:migrate

ดำเนินการเปลี่ยนแปลงเพื่อเพิ่มข้อมูลลงในตาราง

ในแผงตัวแก้ไข VS คุณจะเห็นปุ่ม CodeLens ปรากฏขึ้นเหนือประเภท GraphQL ใน /dataconnect/schema/schema.gql

การค้นหาและการเปลี่ยนแปลงสำหรับเวลาพัฒนา

การดำเนินการที่ไม่มีชื่อซึ่งเชื่อมโยงกับปุ่ม CodeLens เหล่านี้เป็นการดำเนินการที่รวดเร็วและเป็นประโยชน์ ในกรณีนี้จะเป็นการเพิ่มข้อมูลลงในตาราง Data Connect ใช้การกลายพันธุ์ของ GraphQL เพื่ออธิบายวิธีและผู้ที่ดำเนินการกับฐานข้อมูลได้ การใช้ปุ่มนี้จะสร้างการดำเนินการเวลาพัฒนาเพื่อการจัดทำข้อมูลอย่างรวดเร็ว

เนื่องจากคุณได้ทำให้สคีมาเป็นเวอร์ชันที่ใช้งานจริงแล้ว คุณจึงสามารถใช้ปุ่มเพิ่มข้อมูล ปุ่ม CodeLens ใน schema.gql และปุ่มเรียกใช้ (เวอร์ชันที่ใช้งานจริง) ในไฟล์ที่สร้างขึ้นเพื่อดำเนินการเหล่านี้บนแบ็กเอนด์ของคุณได้

วิธีเพิ่มระเบียนลงในตาราง User และ Email

1. ใน schema.gql ให้คลิกปุ่มเพิ่มข้อมูลด้านบนการประกาศประเภท User
2. ในไฟล์ User_insert.gql ที่สร้างขึ้น ข้อมูลแบบฮาร์ดโค้ดสำหรับทั้ง 3 ช่อง
3. คลิกปุ่มเรียกใช้ (เวอร์ชันที่ใช้งานจริง)
   
4. ทำตามขั้นตอนก่อนหน้าซ้ำเพื่อเพิ่มระเบียนลงในตาราง Email โดยระบุ uid ของผู้ใช้ในช่อง fromUid ตามที่มีข้อความแจ้งในการเปลี่ยนแปลง Email_insert ที่สร้างขึ้น

เขียนคำค้นหาเพื่อใส่รายชื่ออีเมล

ทีนี้ก็ถึงส่วนที่สนุก นั่นคือการค้นหา ในฐานะนักพัฒนาซอฟต์แวร์ คุณคุ้นเคยกับการเขียนคำค้นหา SQL แทนที่จะใช้คำค้นหา GraphQL การเขียนจึงอาจดูแตกต่างไปเล็กน้อยในครั้งแรก อย่างไรก็ตาม GraphQL มีความเข้มงวดและปลอดภัยมากกว่า SQL แบบข้อมูลดิบมาก และส่วนขยาย VS Code ของเรา ก็ช่วยลดความซับซ้อนในการพัฒนาซอฟต์แวร์

เริ่มแก้ไขไฟล์ /dataconnect/default-connector/queries.gql หากต้องการรับอีเมลทั้งหมด ให้ใช้คำค้นหาแบบนี้

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

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

ดำเนินการค้นหาโดยใช้ปุ่ม CodeLens ที่อยู่ใกล้เคียง

คุณลักษณะที่น่าสนใจอย่างหนึ่งคือความสามารถในการจัดการความสัมพันธ์ของฐานข้อมูล ให้เหมือนกับกราฟ เนื่องจากอีเมลมีช่อง from ที่อ้างอิงผู้ใช้ คุณจึงฝังไว้ในช่องดังกล่าวและรับข้อมูลเกี่ยวกับผู้ใช้อีกครั้งได้

ติดตั้งใช้งานต้นแบบที่เสร็จสมบูรณ์แล้วไปยังเวอร์ชันที่ใช้งานจริง

คุณได้ผ่านการปรับปรุงเพื่อการพัฒนา ตอนนี้คุณทำให้สคีมา ข้อมูล และการค้นหาใช้งานได้ในเซิร์ฟเวอร์ด้วย UI ของส่วนขยาย Firebase หรือ Firebase CLI เหมือนกับที่ทำกับสคีมา

เมื่อติดตั้งใช้งานแล้ว บริการ Data Connect จะพร้อมประมวลผลการดำเนินการจากไคลเอ็นต์ อินสแตนซ์ Cloud SQL สำหรับ PostgreSQL จะอัปเดตด้วยสคีมาและข้อมูลที่สร้างขึ้นล่าสุดซึ่งทำให้ใช้งานได้แล้ว

(ไม่บังคับ) ติดตั้ง PostgreSQL ในเครื่อง

การติดตั้ง PostgreSQL ในเครื่องและการผสานรวมกับโปรแกรมจำลองช่วยให้คุณสร้างต้นแบบได้ในสภาพแวดล้อมในการพัฒนาซอฟต์แวร์ภายในระบบเต็มรูปแบบ

คุณจะติดตั้งอินสแตนซ์ใหม่ของ PostgreSQL หรือใช้อินสแตนซ์ที่มีอยู่ก็ได้

ติดตั้ง PostgreSQL

ติดตั้ง PostgreSQL เวอร์ชัน 15.x ตามวิธีการสำหรับแพลตฟอร์มของคุณ

• macOS ดาวน์โหลดและติดตั้ง Postgres.app
• Windows: ใช้โปรแกรมติดตั้ง EDB จากหน้าดาวน์โหลด PostgreSQL
• Docker: ดึงและเรียกใช้อิมเมจ pgvector/pgvector:15 ซึ่งมาพร้อมกับการรองรับ PostgreSQL 15.x และเวกเตอร์
• Linux: เราขอแนะนำให้ใช้ Docker กับรูปภาพก่อนหน้า แต่คุณสามารถทำตามวิธีการสำรองสำหรับรูปแบบที่ได้รับความนิยมได้

จดบันทึกชื่อโฮสต์ พอร์ต ชื่อผู้ใช้และรหัสผ่าน และพารามิเตอร์ที่เกี่ยวข้องเอาต์พุตระหว่างลำดับการติดตั้ง

หากต้องการเชื่อมต่อกับอินสแตนซ์ PostgreSQL โปรแกรมจำลองจะต้องมีสิ่งต่อไปนี้

• พารามิเตอร์การกำหนดค่าการตั้งค่าเหล่านี้
• ชื่อฐานข้อมูลจาก dataconnect.yaml และฐานข้อมูลที่มีชื่อที่สอดคล้องกันซึ่งเริ่มต้นในอินสแตนซ์ในเครื่อง

อัปเดต .firebaserc ด้วยสตริงการเชื่อมต่อ

ใช้รายละเอียดการกำหนดค่า PostgreSQL ในเครื่อง รวมถึงชื่อผู้ใช้และรหัสผ่าน PostgreSQL ในเครื่องสำหรับสตริงการเชื่อมต่อเพื่อเพิ่มคีย์ต่อไปนี้ในไฟล์ .firebaserc

{
  "projects": {},
  ...,
  ...,
  "dataconnectEmulatorConfig": {
    "postgres": {
      "localConnectionString": "postgresql://postgresusername:postgrespassword@localhost:5432?sslmode=disable"
    }}
}

เชื่อมต่อกับอินสแตนซ์ PostgreSQL ในเครื่อง

เมื่อกำหนดค่าเสร็จแล้ว หากต้องการเชื่อมต่อกับฐานข้อมูลภายในเครื่อง ให้ทำดังนี้

1. คลิกไอคอน Firebase ใน VS Code ในแผงด้านซ้ายเพื่อเปิด UI ของส่วนขยาย Firebase VS Code
2. คลิกปุ่มเชื่อมต่อกับ PostgreSQL ในเครื่อง

ขั้นตอนถัดไป