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

ในการเริ่มต้นใช้งานอย่างรวดเร็วนี้ คุณจะได้เรียนรู้วิธีสร้าง Firebase Data Connect ในแอปพลิเคชัน

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

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

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

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

เชื่อมต่อกับโปรเจ็กต์ Firebase

1. สร้างโปรเจ็กต์ Firebase หากยังไม่ได้สร้าง
   1. ในคอนโซล Firebase ให้คลิกเพิ่มโปรเจ็กต์ แล้วทำตามวิธีการบนหน้าจอ
2. ไปที่ส่วน Data Connect ของคอนโซล Firebase แล้วทำตามเวิร์กโฟลว์การตั้งค่าผลิตภัณฑ์

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

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

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

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

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

Data Connect รองรับประสบการณ์การพัฒนา 2 แบบ ได้แก่

• หากคุณเป็นนักพัฒนาซอฟต์แวร์ Kotlin Android, iOS, Flutter หรือเว็บ คุณสามารถใช้การพัฒนาด้วย VS Code เพื่อออกแบบและทดสอบสคีมาและการดำเนินการในเครื่องขณะเชื่อมต่อกับอินสแตนซ์ Cloud SQL for PostgreSQL
• หากคุณเป็นนักพัฒนาเว็บ คุณสามารถใช้การพัฒนา IDX เพื่อสร้างต้นแบบในเวิร์กスペース IDX โดยใช้เทมเพลต IDX ที่กําหนดค่าไว้ล่วงหน้าซึ่งมี PostgreSQL, ส่วนขยาย VS Code ที่มีโปรแกรมจำลอง Data Connect และโค้ดไคลเอ็นต์เริ่มต้นที่ตั้งค่าไว้ให้คุณ ดูข้อมูลเพิ่มเติมได้ที่เว็บไซต์ Project IDX

การเริ่มต้นใช้งานนี้จะเน้นที่ขั้นตอนการพัฒนาส่วนขยาย VS Code วิธีดำเนินการต่อ

1. สร้างไดเรกทอรีใหม่สำหรับโปรเจ็กต์ในเครื่อง
2. เปิด VS Code ในไดเรกทอรีใหม่

3. ติดตั้งส่วนขยาย Firebase Data Connect จาก Visual Studio Code Marketplace

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

ติดตั้ง CLI โดยทําตามวิธีการปกติ หากติดตั้ง npm แล้ว ให้เรียกใช้คำสั่งต่อไปนี้

npm install -g firebase-tools

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

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

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

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

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

สร้างสคีมา

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

ภาพยนตร์

ใน 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 VS Code เพื่อทํางานกับฐานข้อมูลเวอร์ชันที่ใช้งานจริง คุณต้องติดตั้งใช้งานสคีมาก่อนดำเนินการต่อ หลังจากทำให้สคีมาใช้งานได้ในฐานข้อมูลเวอร์ชันที่ใช้งานจริงแล้ว คุณควรจะดูสคีมาในคอนโซลได้

1. คุณสามารถใช้ส่วนขยาย Data Connect ใน VS Code เพื่อทำให้ใช้งานได้
   • ใน UI ของส่วนขยาย ภายในแผง Firebase Data Connect ให้คลิกทำให้ใช้งานได้จริง
2. คุณอาจต้องตรวจสอบการเปลี่ยนแปลงสคีมาและอนุมัติการแก้ไขที่อาจก่อให้เกิดความเสียหาย ระบบจะแจ้งให้คุณดำเนินการดังนี้
   • ตรวจสอบการเปลี่ยนแปลงสคีมาโดยใช้ firebase dataconnect:sql:diff
   • เมื่อพอใจกับการเปลี่ยนแปลงแล้ว ให้ใช้การเปลี่ยนแปลงโดยใช้ขั้นตอนที่เริ่มต้นโดย firebase dataconnect:sql:migrate

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

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

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

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

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

1. กลับไปที่ schema.gql แล้วคลิกปุ่มอ่านข้อมูลเหนือประกาศประเภท Movie
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 ที่อยู่ใกล้เคียง

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

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

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

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

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

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

ติดตั้งใช้งานสคีมาและคําค้นหาในเวอร์ชันที่ใช้งานจริง

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

หากคุณใช้ส่วนขยาย Firebase VS Code เพื่อทำให้ใช้งานได้ ให้คลิกปุ่มทำให้ใช้งานได้ในเวอร์ชันที่ใช้งานจริง

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

ดูข้อมูลเพิ่มเติมเกี่ยวกับการใช้โปรแกรมจำลอง Data Connect ในเอกสารประกอบ

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

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

• เพิ่มข้อมูลลงในฐานข้อมูล ตรวจสอบและแก้ไขสคีมา รวมถึงตรวจสอบบริการเชื่อมต่อข้อมูลในคอนโซล Firebase ดูข้อมูลเพิ่มเติมในเอกสารประกอบ ตัวอย่างเช่น เมื่อคุณทําตามการเริ่มต้นใช้งานด่วนเสร็จแล้ว

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

• ดูข้อมูลเกี่ยวกับการสร้าง SDK ของไคลเอ็นต์และการเรียกใช้การค้นหาและการดัดแปลงจากโค้ดไคลเอ็นต์สําหรับเว็บ, Android, iOS และ Flutter