เริ่มต้นใช้งาน Firebase Data Connect ในพื้นที่

ในการเริ่มต้นอย่างรวดเร็วนี้ คุณจะได้ทราบวิธีสร้าง Firebase Data Connect ใน แอปพลิเคชันของคุณในเครื่องโดยไม่ตั้งค่าอินสแตนซ์ SQL ที่ใช้งานจริง

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

ข้อกำหนดเบื้องต้น

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

• Linux, macOS หรือ Windows
• โค้ด Visual Studio
• ติดตั้ง Node.js โดยใช้ nvm-windows สำหรับ Windows หรือ nvm สำหรับ macOS หรือ Linux
• สร้างโปรเจ็กต์ Firebase ใน คอนโซล Firebase

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

คุณจะต้องใช้โค้ด Visual Studio เพื่อจัดการสคีมาและกำหนดการค้นหา ซึ่งจะใช้ในแอปพลิเคชันของคุณ และ SDK ที่มีประเภทชัดเจนจะ ที่สร้างขึ้นโดยอัตโนมัติสำหรับคุณ:

1. สร้างไดเรกทอรีใหม่สำหรับโปรเจ็กต์ในเครื่อง
2. เปิด VS Code ในไดเรกทอรีใหม่
3. ติดตั้งส่วนขยาย Firebase Data Connect จาก Visual Studio Code Marketplace

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

หากต้องการตั้งค่าโปรเจ็กต์ในเครื่อง ให้เริ่มต้นไดเรกทอรีโปรเจ็กต์ ใน VS Code ทางด้านซ้าย ให้คลิกไอคอน Firebase เพื่อเปิด UI ของส่วนขยาย Data Connect VS Code:

1. คลิกปุ่มลงชื่อเข้าใช้ด้วย Google
2. คลิกปุ่มเชื่อมต่อโปรเจ็กต์ Firebase แล้วเลือกโปรเจ็กต์ที่คุณ ที่สร้างขึ้นก่อนหน้านี้ในคอนโซล
3. คลิกปุ่มเรียกใช้ firebase init

4. คลิกปุ่มเริ่มโปรแกรมจำลอง

สร้างสคีมา

ในไดเรกทอรีโปรเจ็กต์ Firebase ให้เริ่มกำหนดสคีมา GraphQL เกี่ยวกับภาพยนตร์ในไฟล์ /dataconnect/schema/schema.gql

ภาพยนตร์

ใน Data Connect ระบบจะแมปฟิลด์ GraphQL กับคอลัมน์ ภาพยนตร์มี id title, imageUrl และ genre Data Connect รู้จักประเภทข้อมูลพื้นฐาน String และ UUID

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

# By default, a UUID id key will be created by default as primary key.
# If you want to specify a primary key, say title, which you can do through
# the @table(key: "title") directive
type Movie @table {
  id: UUID! @default(expr: "uuidV4()")
  title: String!
  imageUrl: String!
  genre: String
}

ข้อมูลเมตาของภาพยนตร์

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

# 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 ในเอกสารประกอบ

เพิ่มข้อมูลลงในตาราง

ในแผงตัวแก้ไข VS คุณจะเห็นปุ่ม CodeLens ปรากฏขึ้นเหนือ ประเภท GraphQL ใน /dataconnect/schema/schema.gql คุณสามารถใช้ปุ่มเพิ่มข้อมูลและเรียกใช้ (ในเครื่อง) เพื่อเพิ่มข้อมูลลงในฐานข้อมูลในเครื่อง

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

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

วิธีตรวจสอบอย่างรวดเร็วว่าเพิ่มข้อมูลแล้ว

1. กลับไปที่ schema.gql แล้วคลิกปุ่มอ่านข้อมูล
2. ในไฟล์ Movie_read.gql ที่สร้างขึ้น ให้คลิกปุ่มเรียกใช้ (ในเครื่อง) เพื่อเรียกใช้การค้นหา

ดูข้อมูลเพิ่มเติมเกี่ยวกับการกลายพันธุ์ของ 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 ที่อยู่ใกล้เคียง

ฟีเจอร์ที่น่าตื่นเต้นมากคือความสามารถในการจัดการความสัมพันธ์ของฐานข้อมูลเหมือนกราฟ เนื่องจาก MovieMetadata มีฟิลด์ movie ที่อ้างอิงถึงภาพยนตร์ คุณสามารถฝังลงในฟิลด์นั้นและรับข้อมูลเกี่ยวกับภาพยนตร์กลับคืนมาได้ ลองเพิ่มประเภท movieMetadata_on_movie ที่สร้างขึ้นลงใน การค้นหา ListMovies

query ListMovies @auth(level: PUBLIC) {
  movies {
    id
    title
    imageUrl
    genre
    movieMetadata_on_movie {
        rating
    }
  }
}

ดูข้อมูลเพิ่มเติมเกี่ยวกับการค้นหาใน Data Connect ในเอกสารประกอบ

สร้าง SDK และใช้ SDK นั้นในแอป

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

1. คลิกปุ่มเพิ่ม SDK ลงในแอป

2. ในกล่องโต้ตอบที่ปรากฏขึ้น ให้เลือกไดเรกทอรีที่มีโค้ด สำหรับแอปของคุณ Data Connect ระบบจะสร้างและบันทึกโค้ด SDK ไว้ที่นั่น

3. เลือกแพลตฟอร์มแอปของคุณ แล้วสังเกตว่าโค้ด SDK นั้น ที่สร้างขึ้นในไดเรกทอรีที่คุณเลือก

ดูวิธีใช้ SDK ที่สร้างขึ้นเพื่อเรียกใช้การค้นหาและการดัดแปลงจากแอปไคลเอ็นต์ (เว็บ, Android, iOS, Flutter)

ทำให้สคีมาและการค้นหาใช้งานได้จริง

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

1. ไปที่ส่วน Data Connect ของคอนโซล Firebase และสร้าง อินสแตนซ์ Cloud SQL ฟรี

2. ใน Terminal ที่ผสานรวมกับ VS Code ให้เรียกใช้ firebase init dataconnect แล้วเลือกภูมิภาค/รหัสบริการที่คุณเพิ่งสร้างในคอนโซล

3. เลือก "Y" เมื่อมีข้อความแจ้ง "File dataconnect/dataconnect.yaml อยู่แล้ว มีการเขียนทับหรือไม่"

4. ใน UI ของส่วนขยาย Data Connect ใน VS Code ให้คลิกปุ่มทำให้ใช้งานได้จริง

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

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

ตรวจสอบโปรเจ็กต์ที่ทำให้ใช้งานได้แล้วและสำรวจเครื่องมือเพิ่มเติม

• เพิ่มข้อมูลลงในฐานข้อมูล ตรวจสอบและแก้ไขสคีมา รวมถึงตรวจสอบบริการเชื่อมต่อข้อมูลในคอนโซล Firebase

ดูข้อมูลเพิ่มเติมในเอกสารประกอบ ตัวอย่างเช่น เนื่องจากคุณได้ ทำการเริ่มต้นอย่างรวดเร็ว:

• ดูข้อมูลเพิ่มเติมเกี่ยวกับสคีมา การค้นหา และการพัฒนาการเปลี่ยนแปลง
• ดูข้อมูลเกี่ยวกับการสร้าง SDK ของไคลเอ็นต์ รวมถึงการเรียกใช้คำค้นหาและการกลายพันธุ์จาก รหัสไคลเอ็นต์สำหรับเว็บ, Android และ iOS และ Flutter